常用CSS缩写语法总结章
发布时间:2009-03-17 13:26:00
http://validator.w3.org/#validate_by_upload 在线校验网址
点浏览,上次找到自己做的页面,就可以了,校验结果在下面显示!
使用缩写可以帮助减少你CSS文件的大小,更加容易阅读。css缩写的主要规则如下:
颜色
16进制的色彩值,如果每两位的值相同,可以缩写一半,例如:
#000000可以缩写为#000;#336699可以缩写为#369;
盒尺寸
通常有下面四种书写方法:
property:value1; 表示所有边都是一个值value1;
property:value1 value2; 表示top和bottom的值是value1,right和left的值是value2
property:value1 value2 value3; 表示top的值是value1,right和left的值是value2,bottom的值是value3
property:value1 value2 value3 value4; 四个值依次表示top,right,bottom,left
方便的记忆方法是顺时针,上右下左。具体应用在margin和padding的例子如下:
margin:1em 0 2em 0.5em;
边框(border)
边框的属性如下:
border-width:1px;
border-style:solid;
border-color:#000;
可以缩写为一句:border:1px solid #000;
语法是border:width style color;
背景(Backgrounds)
背景的属性如下:
background-color:#f00;
background-image:url(background.gif);
background-repeat:no-repeat;
background-attachment:fixed;
background-position:0 0;
可以缩写为一句:background:#f00 url(background.gif) no-repeat fixed 0 0;
语法是background:color image repeat attachment position;
你可以省略其中一个或多个属性值,如果省略,该属性值将用浏览器默认值,默认值为:
color: transparent
image: none
repeat: repeat
attachment: scroll
position: 0% 0%
字体(fonts)
字体的属性如下:
font-style:italic;
font-variant:small-caps;
font-weight:bold;
font-size:1em;
line-height:140%;
font-family:"Lucida Grande",sans-serif;
可以缩写为一句:font:italic small-caps bold 1em/140% "Lucida Grande",sans-serif;
注意,如果你缩写字体定义,至少要定义font-size和font-family两个值。
列表(lists)
取消默认的圆点和序号可以这样写list-style:none;,
list的属性如下:
list-style-type:square;
list-style-position:inside;
list-style-image:url(image.gif);
可以缩写为一句:list-style:square inside url(image.gif);


猜你喜欢
- 本文分析了MySQL中字符串索引对update的影响。分享给大家供大家参考,具体如下:对某一个类型为varchar的字段添加前缀索引后,基于
- 前言上篇文章相信大家已经了解了pytest在cmd下结合各种命令行参数如何运行测试用例,并输出我们想要看到的信息。那么今天会讲解一下pyte
- 这一段CSS代码相当简单,目的就是想用CSS来控制某段文字的显示与隐藏。起初我采用了下面的代码,令人不可思议的是,它们在我的IE6.0上居然
- 大家好,我是辣条。曾经有一个真挚的机会,摆在我面前,但是我没有珍惜,等到失去的时候才后悔莫及,尘世间最痛苦的事莫过于此,如果老天可以再给我一
- 经常看到有人误删数据,或者误操作,特别是update和
- 1、权限赋予 说明:mysql部署在服务器A上,内网上主机B通过客户端工具连接服务器A以进行数据库操作,需要服务器A赋予主机B操作mysql
- DreamWeaver 4的到来让大家兴奋吧?但是大家一定为DreamWeaver4里面的字体、文字大
- 本文实例讲述了Python基于pygame实现图片代替鼠标移动效果。分享给大家供大家参考,具体如下:想想现在学校pygame有几个钟了,就写
- 1、PIL介绍以及图片分割Python 3 安装: pip3 install Pillow1.1 image 模块Image模块
- 页面域关系:主页面a.html所属域A:www.aspxhome.com被iframe的页面b.html所属域B:www.cidianwan
- 前言sklearn是python的重要机器学习库,其中封装了大量的机器学习算法,如:分类、回归、降维以及聚类;还包含了监督学习、非监督学习、
- 一般在Django的视图函数中使用request.POST来获取请求体,request.POST是QueryDict类,通常作为dict来使
- 本文实例讲述了Bootstrap实现前端登录页面带验证码功能。分享给大家供大家参考,具体如下:Bootstrap有自定义的验证码样式,在前端
- 一、本讲学习目标1.掌握构造方法的使用2.掌握析构方法的使用3.掌握self变量的使用二、构造方法(一)概述构造方法指的是__init__(
- 注:本文档做了两个MYSQL实例,多个实例方法以此类推LINUX操作系统:centOS6.3 64bit(安装了系统默认开发包)数据库一:M
- jieba.cut与jieba.lcut的区别jieba.cut生成的是一个生成器,generator,也就是可以通过for循环来取里面的每
- 前言本文提供在在无音频的视频中添加音频的python工具,附上代码。环境依赖ffmpeg环境安装,可以参考:windows ffmpeg安装
- Pivot 及 Pivot_table函数用法Pivot和Pivot_table函数都是对数据做透视表而使用的。其中的区别在于Pivot_t
- scikit-learn库scikit-learn已经封装好很多数据挖掘的算法现介绍数据挖掘框架的搭建方法1.转换器(Transformer
- Python与Perl,C和Java语言等有许多相似之处。不过,也有语言之间有一些明确的区别。本章的目的是让你迅速学习Pytho