常见的CSS属性和值CascadingStyleSheets
字体
文本
背景
位置
边框
列表
其他
CSS中修饰字体的属性
|
属 性 |
描 述 |
属 性 值 |
|
font-family |
字体族科 |
任意字体族科名称都可以使用例如Times、serif等，而且多个族科的赋值是可以使用的，中间用逗号分隔，以防止选择不存在的字体族科 |
|
font-size |
字体大小 |
可以使用绝对大小、相对大小、长度或百分比 |
|
font-style |
字体风格 |
normal（普通），italic（斜体）或oblique（倾斜） |
|
font-weight |
字体加粗 |
normal、bold、bolder或lighter等 |
|
font-variant |
字体变形 |
normal（普通）或small-caps（小型大写字母） |
font: [ <字体风格> || <字体变形> || <字体加粗> ]? <字体大小> [ / <行高> ]? <字体族科>
文字颜色:color:red
CSS中常见的控制文本的属性
|
属 性 |
描 述 |
属 性 值 |
|
letter-spacing |
字母间隔 |
该值必须符合长度格式，允许使用负值 |
|
word-spacing |
文字间隔 |
该值必须符合长度格式，允许使用负值 |
|
text-decoration |
文字修饰 |
underline（下划线），overline（上划线），line-through（删除线），blink（闪烁），或默认地使用none(无) |
|
text-align |
横向排列 |
left、right、center或justify |
|
text-indent |
文本缩进 |
该值必须是一个长度或一个百分比，若百分比则视上级元素的宽度而定 |
|
line-height |
行高 |
可以接受一个控制文本基线之间的间隔的值。当值为数字时，行高由元素字体大小的量与该数字相乘所得。百分比的值相对于元素字体的大小而定。不允许使用负值 |
text-tranform:lowercase,uppercase
CSS中常见的控制背景的属性
|
属 性 |
描 述 |
属 性 值 |
|
background-color |
背景颜色 |
值和color属性值设定方式相同，或使用transparent（透明）值 |
|
background-image |
背景图象 |
图片URL或none（无） |
|
background-repeat |
背景重复 |
repeat、repeat-x、repeat-y、no-repeat |
|
background-attachment |
背景附件 |
scroll（滚动）或fixed（固定）,拖动滚条背景是否滚动设置 |
|
background-position |
背景位置 |
横向的关键字（left, center, right），纵向的关键字（top, center, bottom）百分比和长度也可用做安排背景图象的位置 |
background: <背景颜色> || <背景图象> || <背景重复> || <背景附件> || <背景位置>
应用多个图标放到同一个图片里
<style>
div
{
backgroud-image:url(bg.png) no-repeate 190px 180px;
}
</style>
边框风格属性
各边的风格使用的属性值
none：没有边框，无论边框宽度设为多大
dotted：点线式边框
dashed：破折线式边框
solid：直线式边框
double：双线式边框
groove：槽线式边框
ridge：脊线式边框
inset：内嵌效果的边框
outset：突起效果的边框
边框宽度属性
可以通过边框宽度属性border-width设定上下左右边框的宽度，该属性用1到4个值来设置元素的边界，值是一个关键字或长度，不允许使用负值长度。
如果四个值都给出了，它们分别应用于上、右、下和左边框的式样。
如果只给出一个值，它将被运用到各边上。
如果两个或三个值给出了，省略了的值与对边相等。这个属性是上边框宽度、右边框宽度、下边框宽度和左边框宽度属性的略写。
也可以分别使用border-top-width、border-bottom-width、border-left-width和border-right-width属性单独设置各边的宽度。除了可以使用长度单位定值外，还可以用medium（是默认值）、thin（比medium细）或thick（比medium粗）值。
边框颜色属性
可以通过边框颜色属性border-color设定上下左右边框的颜色，可以使用1到4个关键字。如果四个值都给出了，它们分别应用于上、右、下和左边框的式样。如果给出一个值，它将被运用到各边上。如果两个或三个值给出了，省略了的值与对边相等
略写的边框属性
CSS属性border是边框属性的一个快捷的综合写法，是一个用于设置一个元素边框的宽度、式样和颜色的略写，它包含border-width，border-style和border-color属性。
边框属性border只能设置四种边框，也只能给出一组边框的宽度和式样。为了给出一个元素的四种边框的不同的值，网页制作者必须用一个或更多的属性，如：上边框、右边框、下边框、左边框、边框颜色、边框宽度、边框式样、上边框宽度、右边框宽度、下边框宽度或左边框宽度。
鼠标光标属性
在网页中默认的鼠标指针只有两种，一种是最普通的箭头，另一种是当移动到链接上时出现的“小手”。但现在越来越多的网页都使用了CSS鼠标指针技术，当将鼠标移动到链接上时，可以看到多种不同的效果。CSS可以通过Cursor属性实现鼠标形状的改变，其属性可以是默认的鼠标形状default、小手形状hand、交叉十字crosshair、文本选择符号text、Windows的沙漏形状wait、带有问号的鼠标help以及各个方向的箭头属性值。
CSS中常见的控制列表的属性
|
属 性 |
描 述 |
|
list-style-type |
设定引导列表项的符号类型，可以设置多种符号类型，值为disc、circle、square等 |
|
list-style-image |
使用图像作为定制列表符号 |
|
list-style-position |
决定列表项目缩进的程度 |
decimal,lower-roman,upper-roman,lower-alpha,upper-alpha
<ol style="list-style-type:decimal">
<li>aa</li>
</ol>
为了兼容各浏览器,一般设置style="list-style-type:none",然后再设置list-style-image:url();
