我想让它在使用 CTRL + 或 - 时，文本不会像下面的图像那样受到影响。我试过 webkit，使用百分比而不是像素值，但它不起作用。
.header {
background-color: #FFFFFF;
height: 7%;
position: fixed;
top: 0;
left: 0;
width: 100%;
box-shadow: 0px 5px 10px #424242;
}
.body {
margin: 0;
-webkit-text-size-adjust: 0;
}
.main {
}
.hub {
margin-left: 10%;
margin-right: 10%;
}
@font-face {
font-family: coolvetica;
src: url("font/coolvetica rg.ttf");
}
.title {
font-family: coolvetica;
font-size: x-large;
line-height: 180%;
margin-top: 0.35%;
margin-bottom: 0.35%;
height: 80%;
left: 1%;
position: absolute;
display: inline-block;
vertical-align: top;
overflow: hidden;
}
.navbar {
position: fixed;
top: 2%;
left: 14%;
list-style-type: none;
margin: 0;
padding: 0;
}
.item {
display: inline;
float: left;
}
.label {
color: black;
text-decoration: none;
padding: 8px;
}
.title-box {
height: 100%;
line-height: 100%;
}<html>
<head>
<title>TheShieldNetwork</title>
<link href="style.css" rel="stylesheet">
</head>
<body class="body">
<div class="header">
<p class="title">TheShieldNetwork</p>
<ul class="navbar">
<li class="item"><a class="label" href="default.asp">Home</a></li>
<li class="item"><a class="label" href="news.asp">News</a></li>
<li class="item"><a class="label" href="contact.asp">Contact</a></li>
<li class="item"><a class="label" href="about.asp">About</a></li>
</ul>
</div>
<div class="main">
<img class="hub" width="80%" height="80%" src="img/background.png" alt="Hub">
</div>
</body>
</html>
您可以在 www.theshieldnetwork.com 查看该网站。你知道我将如何修复它吗？
最佳答案
Ctrl- 或 + 是浏览器放大/缩小的方式， 它特别适合帮助人们……(老年人等等……)。
Chrome (webkit) 支持它直到版本:28.0.1500.11
-webkit-text-size-adjust: none;
-webkit-text-size-adjust: 100%
但据我所知，目前只有 iOS 支持此功能，因此 Chrome 会简单地忽略它并继续使用名为 font boosting 的东西。
有一个解决方案，即使它是一个困惑的解决方案。在父元素之一上设置大于元素高度的最大高度似乎可以解决此问题。例如:
<div class="outer">
<ul>
<li>This is a simple list</li>
<li>With list items that get scaled</li>
<li>How annoying!</li>
</ul>
</div>
CSS:
.outer {
max-height: 5000em;
}
这似乎解决了这个问题。尽管它并不理想。
或者您总是可以用图像替换所有文本 - 也不理想。
关于html - 我希望文本不重新调整大小或移动 css，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37559466/