更多>>网页设计 Blog
来源:一度好 时间:2013-09-27 阅读:3822
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> |
评论列表 |
暂时没有相关记录
|
发表评论