css学习01——css格式、使用方法、背景、列表、字体、文本、链接
一、css格式
1、语法:CSS声明以分号(;)结束,声明组以大括号({})括起来:
2、id 和 class 选择器
id 选择器以 "#" 来定义:
#para1
{
text-align:center;
color:red;
}
class选择器以“ . ”来定义:
.center {text-align:center;}
二、css用法
1、外部样式表:在head标签中引入下面标签
<link rel="stylesheet" type="text/css" href="mystyle.css">
2、内部样式表:在head标签下写以下标签
<style>
/*设置样式*/
</style>
3、内联样式:在设计元素中引入以下标签
style="/*样式设置*/"
/*例如:<p style="color:sienna;margin-left:20px">这是一个段落。</p>*/
三、背景设置
body{
background-color:#b0c4de;
background-image::url('bgdesert.jpg');
background-repeat:repeat-x;no-repeat;/*水平与垂直*/
background-attachment:scroll;fixed;/*背景图片属性设置*/
background-position:right top;/*位置*/
}
四、文本设置
color:red;/*文本颜色*/
text-align:center;/*文本位置*/
text-decoration:none;/*删除链接的下划线*/
text-transform:uppercase;/*文本全制为大写*/
text-transform:lowercase;/*文本全制为小写*/
text-transform:capitalize;/*文本全制为单词首字母大写*/
letter-spacing:-3px /*字体间距*/
line-height:200% /*行间距*/
text-align:center/*文本对齐方式*/
text-indent:50px;/*文本首行缩进*/
text-shadow: 2px 2px #ff0000;/*设置文本阴影*/
word-spacing:30px;/*字间距*/
5、字体设置
font-size:40px;/*字体大小*/
font-style:normal;/*字体样式*/
font-family:"Times New Roman",Georgia,Serif;/*字体属性*/
font-weight:bold;normal;900;/*字体粗细*/
6、链接样式
link {color:#000000;} /* 未访问链接*/
visited {color:#00FF00;} /* 已访问链接 */
hover {color:#FF00FF;} /* 鼠标移动到链接上 */
active {color:#0000FF;} /* 鼠标点击时 */
7、列表样式标记
list-style-type:square;/*正方形的小黑点*/
list-style-type:upper-roman;/*I/II、III*/
list-style-type:lower-alpha;/*a、b、c*/
list-style-image: url('sqpurple.gif');/*图片*/