HTML学习——css之二

 关于位置，坐标的中心以显示器的左上角为基准点。

 

CSS 背景属性

属性	描述
background	简写属性，作用是将背景属性设置在一个声明中。
background-attachment	背景图像是否固定或者随着页面的其余部分滚动。
background-color	设置元素的背景颜色。
background-image	把图像设置为背景。
background-position	设置背景图像的起始位置。
background-repeat	设置背景图像是否及如何重复。

 

CSS 文本属性

属性	描述
color	设置文本颜色
direction	设置文本方向。
line-height	设置行高。
letter-spacing	设置字符间距。
text-align	对齐元素中的文本。
text-decoration	向文本添加修饰。
text-indent	缩进元素中文本的首行。
text-shadow	设置文本阴影。CSS2 包含该属性，但是 CSS2.1 没有保留该属性。
text-transform	控制元素中的字母。
unicode-bidi	设置文本方向。
white-space	设置元素中空白的处理方式。
word-spacing	设置字间距。

 

CSS 字体属性

属性	描述
font	简写属性。作用是把所有针对字体的属性设置在一个声明中。
font-family	设置字体系列。
font-size	设置字体的尺寸。
font-size-adjust	当首选字体不可用时，对替换字体进行智能缩放。（CSS2.1 已删除该属性。）
font-stretch	对字体进行水平拉伸。（CSS2.1 已删除该属性。）
font-style	设置字体风格。
font-variant	以小型大写字体或者正常字体显示文本。
font-weight	设置字体的粗细。

CSS 列表属性(list)

属性	描述
list-style	简写属性。用于把所有用于列表的属性设置于一个声明中。
list-style-image	将图象设置为列表项标志。
list-style-position	设置列表中列表项标志的位置。
list-style-type	设置列表项标志的类型。
marker-offset

 

 

CSS Table 属性

属性	描述
border-collapse	设置是否把表格边框合并为单一的边框。
border-spacing	设置分隔单元格边框的距离。（仅用于 "separated borders" 模型）
caption-side	设置表格标题的位置。
empty-cells	设置是否显示表格中的空单元格。（仅用于 "separated borders" 模型）
table-layout	设置显示单元、行和列的算法。

 

CSS 尺寸属性

CSS 尺寸属性允许你控制元素的高度和宽度。同样，还允许你增加行间距。

属性	描述
height	设置元素的高度。
line-height	设置行高。
max-height	设置元素的最大高度。
max-width	设置元素的最大宽度。
min-height	设置元素的最小高度。
min-width	设置元素的最小宽度。
width	设置元素的宽度。

 

CSS 分类属性 (Classification)

CSS 分类属性允许你控制如何显示元素，设置图像显示于另一元素中的何处，相对于其正常位置来定位元素，使用绝对值来定位元素，以及元素的可见度。

属性	描述
clear	设置一个元素的侧面是否允许其他的浮动元素。
cursor	规定当指向某元素之上时显示的指针类型。
display	设置是否及如何显示元素。
float	定义元素在哪个方向浮动。
position	把元素放置到一个静态的、相对的、绝对的、或固定的位置中。
visibility	设置元素是否可见或不可见。

Filters

filter 属性允许您向文本和图像添加更多的样式效果。

h1
{
width:100%;
filter:glow;
}

注释：若需要使用 filter 属性，请始终指定元素的宽度。

上面的例子产生下面的输出：

Header

不同的滤镜

注释：除非 background-color 属性被设置为 transparent，否则某些 Filter 属性将无法工作！

alpha	opacity finishopacity style startx starty finishx finishy	允许您设置元素的透明度	filter:alpha( opacity=20, finishopacity=100, style=1, startx=0, starty=0, finishx=140, finishy=270)
blur	add direction strength	使元素模糊	filter:blur( add=true, direction=90, strength=6);
chroma	color	使指定的颜色透明	filter:chroma( color=#ff0000)
fliph	none	水平反转元素	filter:fliph;
flipv	none	垂直反转元素	filter:flipv;
glow	color strength	使元素发光	filter:glow( color=#ff0000, strength=5);
gray	none	用黑白色来呈现元素	filter:gray;
invert	none	用反转的颜色和亮度值来呈现元素	filter:invert;
mask	color	呈现带有指定背景色和透明前景色的元素	filter:mask( color=#ff0000);
shadow	color direction	呈现带有阴影的元素	filter:shadow (color=#ff0000, direction=90);
dropshadow	color offx offy positive	呈现带有阴影的元素	filter:dropshadow (color=#ff0000, offx=5, offy=5, positive=true);
wave	add freq lightstrength phase strength	把元素呈现为波浪状	filter:wave( add=true, freq=1, lightstrength=3, phase=0, strength=5)
xray	none	使用黑白色显示带有反转色和亮度值的元素	filter:xray;

cursor鼠标属性效果：

 

cursor: auto
cursor: crosshair

cursor: default
cursor: pointer
cursor: hand
cursor: move
cursor: e-resize
cursor: ne-resize
cursor: nw-resize
cursor: n-resize
cursor: se-resize
cursor: sw-resize
cursor: s-resize
cursor: w-resize
cursor: text
cursor: wait
cursor: help