CSS缩写、单位
来源:互联网 发布:淘宝退款不退货的技巧 编辑:程序博客网 时间:2024/06/05 05:12
字体缩写
body{ font-style:italic;//文本样式(粗体斜体) font-variant:small-caps; //英文字母大小写 //normal 默认值。浏览器会显示一个标准的字体。 //small-caps 浏览器会显示小型大写字母的字体。 //inherit 规定应该从父元素继承 font-variant 属性的值。 font-weight:bold; //文本粗细 font-size:12px; line-height:1.5em; font-family:"宋体",sans-serif;}//可以缩写为:body{ font:italic small-caps bold 12px/1.5em "宋体",sans-serif;}
注意:
1、使用这一简写方式你至少要指定 font-size 和 font-family 属性,其他的属性(如 font-weight、font-style、font-variant、line-height)如未指定将自动使用默认值。
2、在缩写时 font-size 与 line-height 中间要加入“/”斜扛。
一般情况下因为对于中文网站,英文还是比较少的,所以下面缩写代码比较常用:
body{ font:12px/1.5em "宋体",sans-serif;}//只有字号、行间距、中文字体、英文字体设置。
字体长度值
像素(px)、em、%百分比三种单位都是相对单位
- 像素
像素指的是显示器上的小点(CSS规范中假设“90像素=1英寸”)。实际情况是浏览器会使用显示器的实际像素值有关,在目前大多数的设计者都倾向于使用像素(px)作为单位。
- em
em就是本元素给定字体的 font-size 值,如果元素的 font-size 为 14px ,那么 1em = 14px;
p{font-size:12px;text-indent:2em;}//实现段落首行缩进 24px(也就是两个字体大小的距离)。
当给 font-size 设置单位为 em 时,此时计算的标准以 p 的父元素的 font-size 为基础。如下代码:
<!--html:--><p>以这个<span>例子</span>为例。</p><!--css:-->p{font-size:14px;}span{font-size:0.8em;}<!--结果 span 中的字体“例子”字体大小就为 11.2px(14 * 0.8 = 11.2px)。-->
- 百分比
p{ font-size:12px; line-height:130%; }<!--设置行高(行间距)为字体的130%(12 * 1.3 = 15.6px)。-->
0 0
- CSS缩写、单位
- CSS代码缩写,单位和值
- CSS代码缩写, 占用更少的宽带,单位和值
- #HTML+CSS基础课程# 第七课:CSS代码缩写,单位和值
- css缩写
- CSS缩写
- CSS 单位
- CSS 单位
- CSS单位
- CSS 单位
- CSS单位
- CSS 单位
- CSS单位
- CSS单位
- css单位
- CSS单位
- css单位
- CSS单位
- vue表单验证 vee-validate
- 运算符重载
- Node.js学习总结
- Android Studio2.3上JNI开发
- web安全知识点
- CSS缩写、单位
- 多线程之重入锁ReentrantLock(四)
- 数据可视化之风向图
- Linux安全漏洞审计工具Lynis
- OpenCV图像数据类型Mat不再陌生
- JavaScript异步处理
- DDS信号发生器的实现(内含代码资料)
- Linux kernel oops panic 调试技巧
- 在iOS利用动画实现全景视图