css属性

字体属性

描      述

     font-family

    用一个指定的字体名或一个种类的字体族科

     font-size

    字体显示的大小

     font-style

    以3个方法其中的一个来定义显示的字体：normal（普通），italic（斜体）或oblique（倾斜）

     font-weight

    以bold为值可以使字体加粗

     font-variant

    设置英文大小写转换

font{font-family: "宋体"; font-size: 12px;  font-style: normal; line-height: 20px;font-weight: bold; font-variant: normal; text-transform: capitalize; color: #666666;  text-decoration: underline;}

文本属性

描        述

     letter-spacing

    定义一个附加在字符之间的间隔数量

     word-spacing

    定义一个附加在单词之间的间隔数量

     text-decoration

    文本修饰属性允许通过5个属性中的一个来修饰文本

     text-align

    设置文本的水平对齐方式，包括左对齐、右对齐、居中、两端对齐

     text-indent

    文字的首行缩进

     line-height

    行高属性接受一个控制文本基线之间的间隔的值

     text-transform

    控制英文文字大小写

font{letter-spacing: 2em; text-align: left; text-indent: 10px; vertical-align: middle; word-spacing: 5em; white-space: normal;}

边  框  属  性

描       述

    border

      边框

    border-top

      上边框

    border-left

      左边框

    border-right

      右边框

    border-bottom

      下边框

    border-color

      边框颜色

    border-style

      边框样式

    border-width

      边框宽度

    border-top-color

      上边框颜色

    border-left-color

      左边框颜色

    border-right-color

      右边框颜色

    border-bottom-color

      下边框颜色

    border-top-style

      上边框样式

    border-left-style

      下边框样式

    border-right--style

      右边框样式

    border-bottom-style

      下边框样式

    border-top-width

      上边框宽度

    border-left-width

      下边框宽度

    border-right-width

      右边框宽度

    border-bottom-width

      下边框宽度

border{ border-top-width: 1px; border-top-style: dotted; border-top-color: #FF0000;}

边框样式属性值

描       述

    none

     无边框

    dotted

     边框由点组成

    dash

     边框由短线组成

    solid

     边框是实线

    double

     边框是双实线

    groove

     边框带有立体感的沟槽

    ridge

     边框成脊槽

    inset

     边框内嵌一个立体边框

    outset

     边框外嵌一个立体边框

定位属性

描       述

   position

    absolute（绝对定位）relative（相对定位）

   top

    层距离顶点纵坐标的距离

   left

    层距离顶点横坐标的距离

   width

    层的宽度

   height

    层的高度

   z-index

    决定层的先后顺序和覆盖关系，值高的元素会覆盖值比较低的元素

   clip

    限定只显示裁切出来的区域。裁切出来的区域为矩形。只要设定两个点即可。一个是矩形左上角的顶点，由top和right两项的设置完成。另一个是右下脚的顶点，由bottom和right两项的设置完成

   overflow

  当层内的内容超出层所能容纳的范围时，Visible：无论层的大小，内容都会显示出来；Hidden：会隐藏超出层的大小的内容；scrol：不管内容是否超出层的范围，选中此项都会为层添加滚动条；auto：只在内容超出层的范围时才显示滚动条

   visibility

  这一项是针对嵌套层的设置，嵌套层插入在其他层中的层，分为嵌套的层（子层）和被嵌套的层（父层）。Inherit：子层继承父层的可见性，父层可见，子层也可见；父层不可见，子层也不可见。Visible：无论父层可见与否，子层都可见。Hidden：无论父层可见与否，子层都隐蔽。

区块属性

描       述

     width

    设定对象的宽度

     height

    设定对象的高度

     float

    让文字环绕在一个元素的四周

     clear

    指定在某一个元素的某一边是否允许有环绕的文字或对象

     padding

    决定了究竟在边框与内容之间应该插入多少空间距离。它有四个属性，分别是：top（上）、right（右） 、bottom（下）、left（左）分别用于设定上下左右的填充距。

margin

决定了内容区块距离外边元素有多少空间距离。分别是：top（上）、right（右） 、bottom（下）、left（左）分别用于设定上下左右的填充距。

#alignLeft{float:left;margin:0;padding:0;width:100px;height:100px;clear:both}

列表属性

描      述

   list-style-type

    设定引导列表项目的符号类型

   list-style-image

选择图象作为项目的引导符号

li{ list-style-image:url(14-25.gif)}

   list-stle-position

    决定列表项目所缩进的程度

列表符号类型属性值

描      述

     disc

     在文本行前面加“●”实心圆

     circle

     在文本行前面加“○”空心圆

     spuare

     在文本行前面加“■”实心方块

     decimal

     在文本行前面加普通的阿拉伯数字

     lower-roman

     在文本行前面加小写罗马数字

     upper-roman

     在文本行前面加大写罗马数字

     lower-alpha

     在文本行前面加小写英文字母

     upper-alpha

     在文本行前面加大写英文字母

     none

     不显示任何项目符号或编号

#alignLeft li { list-style-image: url(images/arrow1.gif);

list-style-type: none;list-style-position: outside;}

列表位置属性值

描         述

     outside

     列表贴近左侧边框

     inside

     列表缩进

定位属性

描       述

   position

    absolute（绝对定位）relative（相对定位）

   top

    层距离顶点纵坐标的距离

   left

    层距离顶点横坐标的距离

   width

    层的宽度

   height

    层的高度

   z-index

    决定层的先后顺序和覆盖关系，值高的元素会覆盖值比较低的元素

   clip

    限定只显示裁切出来的区域。裁切出来的区域为矩形。只要设定两个点即可。一个是矩形左上角的顶点，由top和right两项的设置完成。另一个是右下脚的顶点，由bottom和right两项的设置完成

   overflow

  当层内的内容超出层所能容纳的范围时，Visible：无论层的大小，内容都会显示出来；Hidden：会隐藏超出层的大小的内容；scrol：不管内容是否超出层的范围，选中此项都会为层添加滚动条；auto：只在内容超出层的范围时才显示滚动条

   visibility

  这一项是针对嵌套层的设置，嵌套层插入在其他层中的层，分为嵌套的层（子层）和被嵌套的层（父层）。Inherit：子层继承父层的可见性，父层可见，子层也可见；父层不可见，子层也不可见。Visible：无论父层可见与否，子层都可见。Hidden：无论父层可见与否，子层都隐蔽。css