首页 > 代码库 > 学习css简单内容
学习css简单内容
Css的class,ID和上下文选择符
Class选择符。
Class选择符用来配置某一类css规则,将其应用到网页中一个或多个区域。配置一类样式时,要将选择符配置成类名。在类名前加(.)。类名必须以字母开头,可包含字母,连字符和下划线。类名不能出现空格。
下面以future为类名,配置文本字体颜色为红色。
.future{color:#FF0000;}
ID选择符
用id选择符想网页中单个区域应用独特的css规则。Class选择符可在网页上多次应用。而id选择符在每个网页中只能应用一次。为某个id配置样式说的时候,要在id前面加#。Id名称可以是字母,数字,下划线和连字符。Id名称也不能包含空格。
以下代码在样式表中配置名为content的id:
#content{color:#333333;}
使用id属性,即id=content,便可将id为content的样式应用于你希望的元素。以下代码将id为content的样式应用于一个<div>标记:
<div id=”content”>只是一个例子</div>
后代选择符。
用后代选择符在容器(父)元素的上下文配置一个元素。允许为网页的定制区域配置css,同时减少class和id的数量。先列出容器选择符,在配置样式选择符。例如将content中的段落配置成绿色文本:
#content p {color:#green; }
附:
body{
background-image:url("6.png");
background-position:left;
background-repeat:no-repeat;
background-color:#99FFCC;
color:#FFFF00;
}
div{
border:2px;
background-color:#CCCCCC;
font-size:50px;
font-family:sans-serif;
}
#content
{
color:#333333;
}
#content p {color:#FFFFFF;}
.future
{color:#FFFF00;
}
p{
text-indent:2em;
text-transform:
text-shadow:5px 5px 2px #FFFF00;
}
body{
background-color:#3FFFFF;
color:#1eee10;
}
h1{
background-color:#191970;
color:#E6E6E6;
}
h2{
background-color:#789456;
color:#6A6A7A;
}
nav{background-color:#gge2e2;
}
footer{
width:50px;
height:20px;
color:red;
background-color:#787878;
}
p{
background-image:url("6.png");
background-position:center;
background-repeat:no-repeat;
font-family:monospace;
font-size:40px;
padding-left:40px;
color:#FFF999;
}
ul{
list-style-image:url(13.jpg);
li{
background-color:red;
}
Css解密
学习css简单内容