rel="nofollow"
target="_blank"
class="itm noul
" hidefocus="true" href="http:/字体属性设置之一：谷歌浏览器12px以下字体的显示；方法和原理 - 简书
字体属性设置之一：谷歌浏览器12px以下字体的显示；方法和原理
前言?：chrome谷歌浏览器默认的字体大小为16px；可以通过设置font-size来设置字体大小但是当设置到12px以下的时候字体大小不再改变；对于想设置其他大小的字体就很头疼，本文参考网上的方法，并对该方法以及原理介绍；并对该方法的弊端进行阐述并提出一种合适的解决办法。1.适用对象:block 或者inline-block类型;
2.方法(该方法先以p标签举例)方法：通过设置transform：scale();局限性：标签会发生移动(可以参考下面的代码和图片)；解决办法：设置transform-
可以发现默认的是16px；
可以发现当设置0.8的缩放比例的时候；得到的字体大小:16pxX 0.8 = 12.8px
当在p中设置font-size:10px的时候比例缩放就以10px进行缩放;(可以看到设置缩放之后标签发生移动，这个在下面会说到解决办法）
p中所有的元素都按照p的缩放比例进行缩放；3.原理:
当对p加父容器和对p本身设置宽高以及边框；设置scale0.8，p标签自动上下居中(自身原来的宽高-缩放后的宽高得到的宽高平均分配到上下左右)；用chrome自带的盒模型发现，p标签内容占据宽度依旧是300px X 300px；
当在p后面（div中）加入span元素发现span出了div的范围，说明等比缩放只是改变的原来标签形式上的大小；其原来所在文档流占据的空间位置并未因缩放而腾出来;
发现改变p的位置之后span仍然被挤出来。该方法总结:
1.设置scale时时对整个p标签进行缩放(包含p本身及其内容的所有元素)，而不单单是对字体的缩放；2.进行缩放之后会将缩放之前的宽高-缩放之后的宽高的值自动分配到p标签的上下左右；但缩放并不会改变该标签原来在文档流中所占据的位置大小；不会因为缩放而腾出空间；3.缩放后，缩放对象的位置会发生变化；4.也是scale不适用于inline类型元素的原因(不能设置宽高；虽然自己的宽高靠内容撑起来;但是在设置css的时候无法获取宽高的准确信息(我是这么理解))；所以如果想要设置inline类型的font-size需要先设置display：block或者inline-block。4.解决办法（解决偏移问题）：
即在缩放对象上加入：-webkit-transform-origin: 0 0;或者-webkit-transform-origin-x: 0;-webkit-transform-origin-y: 0;
问答题47 /72 常见浏览器兼容性问题与解决方案？ 参考答案 (1)浏览器兼容问题一：不同浏览器的标签默认的外补丁和内补丁不同问题症状：随便写几个标签，不加样式控制的情况下，各自的margin 和padding差异较大。碰到频率:100%解决方案：CSS里 {margin...
选择qi：是表达式 标签选择器 类选择器 属性选择器 继承属性： color，font，text－align，list－style 优先 计算方法 a－＝＝＝行内样式 b－id选择器的数量 c＝类，伪类和属性选择器的数量 d＝标签选择器和微元素选择器的数量 value＝a*...
选择qi：是表达式 标签选择器 类选择器 属性选择器 继承属性： color，font，text－align，list－style 优先 计算方法 a－＝＝＝行内样式 b－id选择器的数量 c＝类，伪类和属性选择器的数量 d＝标签选择器和微元素选择器的数量 value＝a*...
CSS 绝对底部 - 前端 - 掘金来自国外的设计达人，纯CSS，可以实现: 当正文内容很少时，底部位于窗口最下面。当改变窗口高度时，不会出现重叠问题。甚至，创造该CSS的人还专门成立一个网站介绍这个CSS底部布局方案。不知道他有没有去申请专利:)&!DOCTYPE htm...
CSS Q: HTML引入CSS的方式有哪些？ A: HTML element的style属性，HTML内部style标签引入，HTML外部link标签引入，CSS代码import引入。 Q: png、jpg、gif三种图片格式如何选择，你还知道哪些图片格式？ A: 颜色简...
「有我」是一款O2O垂直服务软件，基于地理位置的社交工具。类似在平台上出租用户闲置的个人时间。该案例从用户体验角度出发，剖析了整个产品关于用户体验的优势与不足。干货不能私藏 ，拿出来跟大家分享。 本文由@Jim 原创投稿 转载请注明来源于产品100并附带本文链接 原文链接：...
2017年11月份的国际护士证ISPN考试即将开始，那么面对如此大场面的考试，不知道美小护们是否已经准备的差不多了。分享一些ISPN考前冲刺群内学员们遇到的问题，这些都是大家平时在做题中遇到的不理解的问题。从同行的经验中学习到的内容更多哦~ 1、After the nurs...
好久，没心情、没心思去考虑读书，或者去写点自己认为值得记忆的东西。为什么？迷茫，受伤了。怎么读的进去，心里捋不出思绪，脑子混乱一片，苦，累，疼，悲，烦，真正的愁死了。 有时候，抽出一点时间，在心情好的时候，去读一本好书。在书中寻找我们丢掉的东西，去思考的东西，以及不知道的东...网页缩放的问题，能不能只放大文字不放大图片/flash？
09:14:00 +08:00 · 1631 次点击
现在显示器都大了，双屏/三屏也都用上了，单独一个显示器用来看网页的用户应该不少吧排版设计的好的网页，比如v2ex这种，整体放大150%没有任何问题，浏览起来也很舒服，但有些排版比较差的网页，整体放大150%会导致页面各种错位，反而影响了可读性，保持原始大小又觉得费眼。主要问题是浏览器缩放是所有元素都缩放，但我想保持图片flash为正常大小能不能实现呢我尝试对一些常去的网页自己写css，但实话说工作量有点大，不知道css能不能有比如直接原始字号*1.5的实现方法
3 回复 &| &直到
09:49:58 +08:00
& & 09:17:10 +08:00
你可以反过来，只缩放图片或者Flash，文字和其他内容靠浏览器本身的放大功能来实现就简单多了。
& & 09:46:27 +08:00
有的网页设计不用px用em，加一个全局的放大就好了
& & 09:49:58 +08:00
浏览器的缩放不像是整体缩放，而是单个元素缩放，这是很奇怪的做法
& · & 3200 人在线 & 最高记录 3541 & · &
创意工作者们的社区
World is powered by solitude
VERSION: 3.9.8.0 · 59ms · UTC 02:14 · PVG 10:14 · LAX 18:14 · JFK 21:14? Do have faith in what you're doing.请完成以下验证码
查看: 4870|回复: 2
解决部分网页字体大小无法缩放的问题
吹自田野的风
最近太平洋电脑网改版了，调节缩放比后虽然网页框架被放大了，但是字体大小却不会变了，这可苦了我这等视力不太好的人，平时可都是要缩放到175%的样子看字才舒服的，用IE和火狐试了下发现都能正常调节字体大小的。
后来搜索下了，找到了个解决方法。
打开C:\Users\用户\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets\Custom.css
添加一句*{-webkit-text-size-adjust:auto !}之后字体就能正常缩放了
版区有你更精彩： ）
很有用，支持一下
好像挺好使的!
Copyright & KaFan &KaFan.cn All Rights Reserved.
Powered by Discuz! X3.4( 苏ICP备号 ) GMT+8,在CSS中，如何设置一个层的位置，当缩放浏览器窗口时，该层会自动偏移？
我的图书馆
在CSS中，如何设置一个层的位置，当缩放浏览器窗口时，该层会自动偏移？
在CSS中，如何设置一个层的位置，当缩放浏览器窗口时，该层会自动偏移？
让你那个浮动的层的容器的大小固定
&div style="width:固定值"&&div style="float:left"&&/div&&/div&
是这样。我画了一个表格，这个表格能够随着浏览器的窗口大小变化而自动居中。相爱你在希望把这个层放在这个表格上面，并且相对这个表格位置不动。最好给个CSS代码。
说清楚点，或者贴出代码，这样说我也想象不出你的网页是怎样布局的，也不知道你那个浮动的层到底在哪里～
好。详细点：以下是一个表格，并包含一个图片。这个表格是居中的，也就是说，随着浏览器窗口的改变，这个表格自动改变位置居中。那个png图片是个背景。我现在有个层，这个层里包括一个图片“欢迎”两字。现在，我想把这个“欢迎”二字/固定/在背景图片左上角x:y(10:20)的位置上上，这个没问题。当浏览器改变大小的时候，表格自动居中，背景图片改变位置了。但是“欢迎”二字的位置还是在原来的位置，不跟随背景移动。这就是问题所在。#logo {//以下css不知如何写 position: left:219 top:79 width:115 height:29 z-index:1; margin-top: 0}&div id="logo"&&img src="welcome.png" width="364" height="62" /&&/div&&table width="500" border="0" align="center" cellpadding="0" cellspacing="0"& &tr& &td height="142" align="center" background="bj.png"&&&/td& &/tr& &tr& &td&&&/td& &/tr&&/table&
这样啊，其实很简单，你把div层放到table中去，给这个table一个样式position:然后用position:absolute；top:20left:10很容易就可以实现啊 另外我想问下：为什么不把这两个字处理到图片里去，直接在图片中展示？
&table style="position:relative"&&div style="position:top:20left:10"&&/div&&/table&
啊，不好意思，弄错了，要的是背图片的(10,20)处，那就应该是left:500/2-图片宽/2+10top:20;
下班了，我要走了，有什么问题明天再帮你解决吧，嘻嘻
你的问题：为什么不把这两个字处理到图片里去，直接在图片中展示？是的，以前通常的做法都是放到图片中的。但是随着这两年浏览器支持PNG图片，就分开了。其优点是，当更换背景图片的时候，直接更换，不需要处理背景图片在上面加字了。而且，因为PNG的支持，附加的字完全可以保留透明、阴影等效果，这样用层的模式叠加到图片上，和PS到图片上效果完全一样。总之，这样做可以方便的更换背景和文字。甚至添加新文字或调节文字在图片上的位置时，也不需要PS软件。另外，我以前习惯使用TABLE布局，现在准备安全使用DIV做。如果你在这方面是否很熟悉？能否留下个联系方式，以便请教，谢谢！
你的方法很正确，太帅了。虽然目的达到了，但是我还是想彻底抛弃表格，请留个联系方式吧。
请通过我的信息联系我。
TA的推荐TA的最新馆藏[转]&[转]&[转]&[转]&[转]&[转]&
喜欢该文的人也喜欢}