更多>>网页设计 Blog
来源:一度好 时间:2013-09-27 阅读:3663
CSS层叠样式表属性及样式文件和JS文件的调用
CSS层叠样式表属性 |
||
(一)“类型”选项卡 |
||
属性名称 |
属性值 |
属性说明 |
font-family |
宋体,华文行楷 |
字体 |
font-size |
14pt |
字号 |
font-weight |
bold |
加粗 |
font-style |
italic |
斜体 |
color |
#9900000 |
文本颜色 |
text-decoration |
underline,overline,line-through,none |
修饰线 |
(二)“背景”选项卡 |
||
属性名称 |
属性值 |
属性说明 |
background-color |
#ff0000 |
背景颜色 |
background-image |
url(images/img.jpg) |
背景图像 |
background-repeat |
none,repeat,repeat-x,repeat-y |
背景重复 |
background-attachment |
fixed,scroll |
背景附件 |
background-position |
center,center |
背景定位 |
(三)“区块”选项卡 |
||
属性名称 |
属性值 |
属性说明 |
text-align |
left,center,right,justify |
文本对齐 |
text-indent |
20px |
文本缩进 |
display |
block |
文本显示方式 |
letter-spacing |
10em |
字母间距 |
word-spacing |
10em |
单词间距 |
vertical-align |
top,middle,bottom |
垂直对齐 |
(四)“方框”选项卡 |
||
属性名称 |
属性值 |
属性说明 |
width |
780px |
方框宽度 |
height |
120px |
方框高度 |
padding |
0px |
填充 |
padding-top |
0px |
顶填充 |
padding-right |
0px |
右填充 |
padding-bottom |
0px |
下填充 |
padding-left |
0px |
左填充 |
margin |
0px |
边界 |
margin-top |
0px |
上边界 |
margin-right |
0px |
右边界 |
margin-bottom |
0px |
下边界 |
margin-left |
0px |
左边界 |
float |
left,right,none |
浮动 |
clear |
left,right,both,none |
清除 |
(五)“边框”选项卡 |
||
属性名称 |
属性值 |
属性说明 |
border |
1px solid #ff0000 |
四个边线一样 |
border-top-width |
1px |
上边线宽度 |
border-top-style |
solid,dashed |
上边线线型 |
border-top-color |
#ff0000 |
上边线颜色 |
(六)“列表”选项卡 |
||
属性名称 |
属性值 |
属性说明 |
list-style-type |
none,disc,circle,square |
列表样式类型 |
list-style-image |
url(images/img.jpg) |
列表样式图片 |
list-style-position |
inside,outside |
列表样式定位 |
(七)“定位”选项卡 |
||
属性名称 |
属性值 |
属性说明 |
width |
数值 |
方框宽度 |
height |
数值 |
方框高度 |
position |
fixed(固定),absolute(绝对),relative(相对),statuc(静态) |
定位类型 |
visibility |
visible(可见),hidden(隐藏),inherit(继承) |
可见性 |
overflow |
scroll,hidden,visible,auto,inherit |
溢出 |
z-index |
auto,inherit |
Z轴 |
left |
数值 |
窗口左边距 |
top |
数值 |
窗口顶边距 |
right |
数值 |
窗口右边距 |
bottom |
数值 |
窗口底边距 |
clip |
rect(20px,20px,10px,0px); |
裁切 |
(八)“扩展”选项卡 |
||
属性名称 |
属性值 |
属性说明 |
cursor |
hand|text|wait|default|move|help |
光标类型 |
(九)链接外部样式表文件 |
||
<link href="mystyle.css" rel="stylesheet" type="text/css"> |
||
(十)链接外部JavaScript文件 |
||
<script language="javascript" href="mystyle.js" type="text/javascript"></script> |
评论列表 |
暂时没有相关记录
|
发表评论