让谷歌浏览器 chrome 支持小于12px的字体
webkit的私有属性:{-webkit-text-size-adjust:none;} 但是,在最新版的谷歌里。已经不在支持这个属性啦。 用css3的transform:scale()缩放大小,但是缩放的宽度是不会改变的。所以额外加了个span标签, 又用了另外的 专门给chrome的样式 @media screen and (-webkit-min-device-pixel-ratio:0) { } 另外:火狐 @-moz-document url-prefix() { } #nav {
width:100%;
height:34px;
background-color:#000;
}
#nav ul {}
#nav ul li {
float:left;
margin-right:3px;
}
#nav ul li a {
float:left;
font-size:11px;
display:block;
height:34px;
line-height:34px;
color:#fff;
text-transform:uppercase;
}
#nav ul li a:hover,#nav ul li a.selected {
background-color:#313131;
text-decoration:none;
}
#nav ul li a span {
padding:0px 22px;
display:block;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
#nav ul li a span {
padding:0px 15px;
-webkit-transform:scale(0.916);
-o-transform:scale(1);
}
} <div id="nav">
<div class="pagewraper">
<ul id="top_Menu">
<li><a href="Index.php" ><span>home</span></a></li>
<li><a href="Company.php" ><span>company</span></a></li>
<li><a href="Machinery.aspx"><span>machinery parts</span></a></li>
<li><a href="Rigging.aspx"><span>rigging hardware</span></a></li>
<li><a href="Heat.aspx"><span>heat exchanger</span></a></li>
<li><a href="Qa.php"><span>quality assurance</span></a></li>
<li><a href="Qualification.php"><span>qualification</span></a></li>
<li><a href="Contact.php"><span>contact us</span></a></li>
</ul>
</div>
</div>
让谷歌浏览器 chrome 支持小于12px的字体的更多相关文章
- 如何让谷歌浏览器支持小于12px的字体
CSS3有个新的属性transform,而我们用到的就是transform:scale() 书写一段代码 <body> <p>我是一个小于12PX的字体</p> & ...
- 谷歌浏览器支持小于12px的字体
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- 【css】怎么让Chrome支持小于12px 的文字
谷歌浏览器Chrome是Webkit的内核,有一个 -webkit-text-size-adjust 的私有 CSS 属性,通过它即可实现字体大小不随终端设备或浏览器影响.CSS样式定义如下:-web ...
- 小于12px的字体大小在Chrome中不起作用
今天遇见一个小问题,让人挺郁闷的,在Chrome浏览器中无法把字体变成12px以下.网上搜索以下,发现无论中文英文数字在网页中CSS设置小于12px后各大浏览器均支持,在谷歌chrome浏览器不支持解 ...
- 设置小于12px的字体
.small-font{ font-size:12px; -webkit-transform-origin-x: 0; -webkit-transfo ...
- 使用css怎么让谷歌支持小于12px的文字比如10px
1.小于12px的字体,如果内容固定,可以将内容切除做图片,没有兼容问题. 2.-webkit-text-size-adjust:none;老版本谷歌,27版本之后无用 3.-webkit-trans ...
- CSS3 - chrome,傲游,360极速浏览器不支持小于12px的字号的解决办法
google流量器chrome,傲游,360极速浏览器都是基于webkit内核浏览器,默认不支持小于font-size小于12px 的字号,即定义font-size小于12px时会发现字体大小依然是1 ...
- chrome显示小于12号字体的方法
我现在做一个支持英文的网站,但是字体要设置小于12号字体,我百度方法是-webkit-text-size-adjust:none; 但是谷歌为什么不支持啊, 有没有解决办法 让谷歌浏览器 支持小于 ...
- [Chrome](CSS) 解决Chrome font-size 小于 12px 无效
Chrome中 font-size 小于 12px 会失效. 解决的办法一种是: -webkit-text-size-adjust:none; (但是Chrome27之后取消了支持) 利用CSS3的缩 ...
随机推荐
- HTML中行内元素与块级元素的区别
块级元素:独占一行,可设宽高,内外边距:块级元素有form,p,h1到h6,ol ,ul ,dl和dd和dt ,hr,li,pre,caption ,div ,table ,tr ,td ,th等. ...
- 基于综合服务平台浅谈Sass应用
一. 前言 CSS不是一种编程语言,只是单纯的一行行的描述,没有逻辑没有变量,因此写CSS对于习惯于运用逻辑思维编码的程序员来说是一件很头疼的事.于是勤奋的程序员就开始运转他们敏捷的大脑, ...
- php标记,变量,常量
php标记 语法:有4种书写格式 1.<?php ... ?> 强烈推荐使用. 如果当前 php的代码段,是整个文档的最后一段,可以省略结束标记?(建议省略) 每句语句都要以分号;结束. ...
- 使用DotNetOpenAuth搭建OAuth2.0授权框架——Demo代码简单说明
前段时间随意抽离了一部分代码作为OAuth2的示例代码,若干处会造成困扰,现说明如下: public class OAuthController : Controller { private stat ...
- php六种基础算法:冒泡,选择,插入,快速,归并和希尔排序法
$arr(1,43,54,62,21,66,32,78,36,76,39); 1. 冒泡排序法 * 思路分析:法如其名,就是像冒泡一样,每次从数组当中 冒一个最大的数出来. * 比 ...
- eclipse与myeclipse恢复已删除的文件和代码
1.类文件的恢复 选择项目后右键-->选择Restore from Local history-->出现下面的界面: 勾选后按Restore就恢复了,真的很强大很方便:但我没有就此罢手,我 ...
- C#winform如何最小化主窗口
1.如果不想让程序在任务栏中显示,请把窗体的属性ShowInTaskbar设置为false;2.如果想让程序启动时就最小化,请设置窗体的属性WindowState设置为Minimized.(Minim ...
- iframe的用法
iframe 元素会创建包含另外一个文档的内联框架(即行内框架). 属性: 创建内联框架(JSP页面) <%@ page language="java" import=&qu ...
- 今天遇到的关于mysql的max_allowed_packet的问题
今天,运维组的同学来找我,说是备份池的文件描述没有显示出来,而且是从20号开始就不能显示,之前的文件描述就能显示,而且20号他们上传备份的数据确实是传过来的.但是是在web界面文件描述显示不出来. 先 ...
- 循序渐进Python3(三) -- 1 -- 内置函数
对函数有了一定了解之后,我们来看看Python的内置函数.下图是Python所有的内置函数,共68个.