font-weight 字体浓淡(精细)属性

该CSS属性用来设定字体的浓淡程度。

值:normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | inherit

可用值    值的说明 
normal    缺省值。字体正常显示。 
bold        粗体 
bolder     比粗体更加粗 
lighter      比正常字体淡 
100          至少和200一样淡 
200         至少和100一样粗,至少和300一样淡 
300          至少和200一样粗,至少和400一样淡 
400         字体正常显示,相当于normal。 
500         至少和400一样粗,至少和600一样淡 
600         至少和500一样粗,至少和700一样淡 
700         粗体,相当于bold。 
800         至少和700一样粗,至少和800一样淡 
900         至少和800一样粗

字体浓淡属性是根据用户电脑上安装的字体相应匹配改变的。在很多情况下,由于系统作了最相近的匹配,因此看不出不同的 font-weight 值有什么区别。

font-weight 值为400,相当与 normal,即正常字体,而值 700,相当于粗体 bold。如果值为 bolder 或者 lighter,则是相对其父对象来说的。如果父对象的值为 normal,子对象值设为 bolder,则最终以 bold,即粗体显示。

示例代码
<p style = "font-weight:bold">
<p style = "font-weight:800">
<p style = "font-weight:lighter">
继承

适用于
所有元素

注意红色文字部分!

原文:

http://blog.163.com/udb1982@126/blog/static/54260835201032652439481/

[转]css讲解 font-weight:bold和bolder区别的更多相关文章

  1. CSS 字体(font)实例

    CSS 字体(font)实例CSS 字体属性定义文本的字体系列.大小.加粗.风格(如斜体)和变形(如小型大写字母).CSS 字体系列在 CSS 中,有两种不同类型的字体系列名称: 通用字体系列 - 拥 ...

  2. TP5.1:将外部资源引入到框架中(css/js/font文件)

    为了让我们的框架形式变得更加好看,我们需要加入Bootstrap和Jq文件到框架中 1.通过Bootstrap和jq官网进行相关文件的下载 (1)Bootstrap下载地址:https://v3.bo ...

  3. css中zoom和transform:scale的区别

    css中zoom和transform:scale的区别 关于zoom: 以前只是看到别人的代码中用过zoom,自己从未使用过,今天在探究ie7兼容inline-block时,发现里面提到了zoom.下 ...

  4. CSS display:inline和float:left两者区别探讨

     本文和大家重点讨论一下CSS display:inline和float:left两者的区别,CSS display是指显示状态,inline表示内联,特点是紧贴着前一个内联元素,通常默认的内联元素有 ...

  5. (转)css内边距与外边距的区别,精辟啊

    css内边距与外边距的区别 (2012-05-02 13:54:54) 转载▼ 标签: 杂谈 分类: css 本文也是网上看了后收藏的,忘了原地址(以后收藏文章得注意) 你真的了解margin吗?你知 ...

  6. CSS的width:100%和width:auto区别

    CSS的width:100%和width:auto区别 一.   问题 前段时间在调整树结构的时候,发现如果树的节点名称比较长的话在IE6下则不会撑开外面的元素,导致节点的名称只显示了一半,同时图标和 ...

  7. css height:100%和height:auto的区别

    css height:100%和height:auto的区别 height:auto,是指根据块内内容自动调节高度.height:100%,是指其相对父块高度而定义的高度,也就是按照离它最近且有定义高 ...

  8. css选择器中:first-child 与 :first-of-type的区别

    ## css选择器中:first-child 与 :first-of-type的区别 ---- :first-child选择器是css2中定义的选择器,从字面意思上来看也很好理解,就是第一个子元素.比 ...

  9. css中 font常用的样式属性

    今天我总结一下文本常用的字体样式 1.font常用样式 1)字体类型 语法:font-family: +字体类型:    如: font-family:宋体; 2)字体大小 语法:font-size: ...

随机推荐

  1. Windows彻底卸载VMWare虚拟机

    彻底卸载VMWare虚拟机 1.停止VMware相关服务 在服务中将VMware开头的所有服务停止 2.打开VMware安装向导 进入卸载页面 在卸载页面中选中VMware右键点击,进入更改后,页面为 ...

  2. 常用display属性

    table 1. 宽高由内容撑开 2.独占一行 3.可设置宽高 4.可设置margin.padding inline-table 与display: table大体一致,区别在于不独占一行,为行内元素 ...

  3. 2.3UML建模之用例图关系

    一.UML简介 UML(统一建模语言,Unified Modeling Language)是一种定义良好.易于表达.功能强大且普遍适用的可视化建模语言.它融入了软件工程领域的新思想.新方法和新技术.它 ...

  4. Entity Framework 7 动态 DbContext 模型缓存 ModelCaching

    EF7里实例化DbContext变的有点麻烦了, 下面这个基类会有所帮助: public abstract class BaseDbContext : DbContext { private stri ...

  5. jupyter && ipython notebook简介

    2017-08-19 最近用了一下 ipython notebook 也就是 jupyter,这里有一个介绍还不错: http://www.cnblogs.com/howiewang/p/jupyte ...

  6. CentOS 7(64位) 下Docker的安装

    系统要求是64位,内核版本至少3.10. 首先添加yum软件源: 之后更新yum软件源缓存,并安装docker-engine 查看docker 版本: Cannot connect to the Do ...

  7. nodejs 中module.exports 和 exports 区别详细介绍

    你肯定非常熟悉nodejs模块中的exports对象,你可以用它创建你的模块接下来介绍创建过程,感兴趣的朋友可以参考下 你肯定非常熟悉nodejs模块中的exports对象,你可以用它创建你的模块.例 ...

  8. Android使用SVG小结

    SVG的全称是Scalable Vector Graphics,叫可缩放矢量图形.它和位图(Bitmap)相对,SVG不会像位图一样因为缩放而让图片质量下降.它的优点在于节约空间,使用方便. andr ...

  9. 关于html的一些杂技

    html预定义字符指的是 :<   > html实体指的是 $amp 等 php中htmlspeciachar()就是讲html预定义字符转换成html实体. 浏览器渲染时,会将html实 ...

  10. js字符串常用操作

    1.字符串分割 var myStr = "I,Love,You,Do,you,love,me"; var substrArray = myStr .split(",&qu ...