浏览器是怎样根据 CSS 中是的 font

html-css014

浏览器是怎样根据 CSS 中是的 font,第1张

有一点需要强调:

浏览器做的工作主要是根据 CSS 给出的 font-weight 值来匹配(match)字重(weight),并非根据 CSS 的 font-weight 值合成(synthesize)相应的字重。

但多数浏览器确实也会在粗体、斜体缺失的时候自己来合成,CSS 规范中也提到了这一点:

Although the practice is not well-loved by typographers, bold faces are often synthesized by user agents for faces that lack actual bold faces. For the purposes of style matching, these faces must be treated as if they exist within the family.

如果 700 不存在的时候可以合成,那 500、600 不存在的时候是不是也该合成仿粗体(faux bold)呢?显然,浏览器之间有分歧。

这张对比图体现的就是 Firefox 没有合成 600,直接用了 Georgia Bold(700),这应该是最合理的行为;而 Chrome 用 Georgia Regular 合成了 600。

但仿粗体的问题很大,「not well-loved by typographers」。而且从 Stack Overflow 的那张对比图还可以看出来:仿粗体不仅丑,此处它比真正的粗体还宽。

CSS2.1 和 CSS3 的相关规范都值得一看。

另外,指定「100, 500, 600, 700, 900」却没有「400」,这是很奇怪的做法。

1、如果想改变css背景图片,一般的做法只能使用css滤镜;

2、css滤镜主要包括:

Speia滤镜 灰度图滤镜 高斯模糊滤镜 反色滤镜 饱和度滤镜

对比度滤镜亮度滤镜色相旋转滤镜 阴影滤镜

3、css滤镜在浏览器兼容是比较坑爹的问题,ie浏览器有自己一套滤镜filter家族,基本所有ie内核浏览器都支持,ff和Chrome,opera则主要使用css3的滤镜,这些浏览器在后期版本支持css3的滤镜(目前版本基本都支持html5和css3),通过滤镜改变背景图的颜色和效果,当然这些滤镜主要是为了效果而产生,颜色只是固定的几种效果。

4、个别时候,css滤镜还需要结合js使用,才能到达必要效果,其实一般背景图片都是用透明度的css来设置它的颜色度;

透明度css列子:

transparent_class {

filter:alpha(opacity=50)

-moz-opacity:0.5

-khtml-opacity: 0.5

opacity: 0.5

}

这个需要后端语言支持,CSS无法判断内容,CSS是样式表只负责描述页面的样式,而不负责内容

你可以使用后端语言判断不同的内容给表格添加不同的class,然后在css中为相应的class设置样式