转自:http://blog.csdn.net/shenzhennba/article/details/7356095

1.字体属性主要包括下面几个:
font-family(字体族): “Arial”、“Times New Roman”、“宋体”、“黑体”等;
font-style(字体样式): normal(正常)、italic(斜体)或oblique(倾斜);
font-variant (字体变化): normal(正常)或small-caps(小体大写字母);
font-weight (字体浓淡): 是normal(正常)或bold(加粗)。有些浏览器甚至支持采用100到900之间的数字(以百为单位);
font-size(字体大小): 可通过多种不同单位(比如像素或百分比等)来设置, 如:12xp,12pt,120%,1em

如果用 font属性的话,就可以把几个样式进行简化,减少书的情况;font 属性的值应按以下次序书写(各个属性之间用空格隔开):
font-style | font-variant | font-weight | font-size | font-family
例如: 
.fontStyle01{
        font-style: italic;
        font-variant: normal
        font-weight: bold;
        font-size: 30px;
        font-family: arial, sans-serif;
    }
上面的样式简写为:
.fontStyle01{font:italic normal bold 12px arial,verdana;}

2.背景
 background-color:#999999; //元素的背景色
 background-image : url("path/bgFile.gif"); //设置背景图像
 background-repeat : repeat-x | repeat-y | repeat | no-repeat; //设置重复方式
 background-attachment : fixed | scroll; //设置背景图片的固定方式
 background-position : X轴坐标,Y轴坐标[top,bottom,center,left,right,20px,10%];  //设置背景的左上角位置,坐标可以是以百分比或固定单位

background缩写各个值的次序依次如下:
background-color | background-image  | background-repeat | background-attachment | background-position
   如果省略某个属性不写出来,那么将自动为它取缺省值。比如,如果去掉background-attachment和background-position的话:
background: #FFCC66 url("butterfly.gif") no-repeat;
例如:
.bg01{
   background-image: url("path/bgFile.gif");
   background-repeat: no-repeat;
   background-attachment: fixed;
   background-position: left top;
}

上面可以简写为:

.bg01{

   background:#FFCC66  url("path/bgFile.gif")  no-repeat  fixed  left  top;

}

补充:background-size

取值:
1、value1 value2
宽度 高度
2、value1% value2%
百分比
3、cover
覆盖,将背景图像等比缩放,直到背景能够覆盖到元素的所有区域
4、contain
包含,将背景图像等比缩放,直到背景图像碰到右边或下边时,停止缩放。

CSS中(font和background)的简写形式的更多相关文章

  1. CSS中对图片(background)的一些设置心得总结

    写网页的时候很多情况需要对图片进行操作,如何在不进行专业的美工裁切操作的情况下而让自己的素材度达到最大的满意度呢,这是一个问题,对于懒得开ps切图的我,通常会直接在网络上download一张图片,直接 ...

  2. CSS 中Font Awesome 图标(附码表)

    HTML中缩放的矢量图标,您可以使用CSS所提供的所有特性对它们进行更改,包括:大小.颜色.阴影或者其它任何支持的效果. Font Awesome 传送门:http://fontawesome.das ...

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

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

  4. css 中font属性知识点总结

    一. font属性值可以继承.例如子元素可以继承父元素的行高,字体大小等等. 二.font属性可以进行连写:font: font-sytle  font-weight  font-size/line- ...

  5. CSS中常用的简写模式

    一.font属性简写 font-style:字体样式 normal 默认值.浏览器显示一个标准的字体样式. italic 浏览器会显示一个斜体的字体样式. oblique 浏览器会显示一个倾斜的字体样 ...

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

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

  7. CSS 中关于background 属性功能

    background 是 css中的核心属性,我们对他应该充分了解. background-image   定义背景图像  这个属性是我们用的最多的属性 设置背景图像有两个方式 background: ...

  8. css中background背景属性概

    css中background背景属性概 background:url(背景图片路径)  no-repeat;/*不重复默认在左上方*/background:url(背景图片路径)  no-repeat ...

  9. CSS 背景图像 background属性简写

    background属性简写 background属性可以像margin padding属性一样,有简写方法,它的简写顺序是: background-color background-image ba ...

随机推荐

  1. linux配置虚拟主机

    linux 下怎么配置虚拟主机 linux 下怎么配置虚拟主机,在网上找到N个资料都是高手们随便说几句,都没怎么说清楚.问题:  我把域名(bs.jxiop.com)指向了 68.10.140.10 ...

  2. Python算法(一)冒泡排序

    3 5 1 6 2 1)第一次:找到这些数中最大的一个,并把它放最后. 3.5找到大的数放到第二个位置 5.1找到大的数放到第三个位置 5.6找到大的数放到第四个位置 2.6找到大的数放大第五个位置 ...

  3. Flux architecture

    [Flux architecture] Flux is a pattern for managing data flow in your application. The most important ...

  4. linux中weblogic相关命令操作

    在weblogic的目录下找到bin目录,其中有startWeblogic.sh.startManagerWeblogic.sh等 首先需要启动startWeblogic.sh,这个是管理服务,也就是 ...

  5. msf客户端渗透(三):提权、图形化payload

    对普通权限session提权 生成一个木马 开启Apache服务 将木马上传网页 被攻击者从这个网页上获取到这个木马 攻击者开启msf侦听 当被攻击者双击这个木马文件时 攻击者就获取到一个sessio ...

  6. Jmeter(三十九)获取响应结果中参数出现的次数(转载)

    转载自 http://www.cnblogs.com/yangxia-test 在测试中,有时候会遇到要统计响应结果中某个参数出现了多少次,如果量级很大,一个一个数不太现实,下面讲一下实现自动打印出该 ...

  7. VmWare15 许可证

    UG5J2-0ME12-M89WY-NPWXX-WQH88

  8. ss源码学习--从协议建立到完成一次代理请求

    上一次介绍了ss源码中各个事件处理函数完成的工作,这次具体分析一下协议的建立以及请求数据的传输过程. 因为ss的local和server共用一个类以及一系列的事件处理函数,所以看起来稍显复杂.下面来将 ...

  9. IDEA中配置JUnit单元测试

    参考安装教程:https://www.jianshu.com/p/c37753b6dbd6 如果想用junit4的话,需要在pom.xml中配置. 需要安装JUnitGenerator V2.0插件, ...

  10. 第三章 列表(e)插入排序