div+css学习

div+css代码

Div就是一个容器放内容，存放表格，图片等等

Css层叠控制，控制div内部元素的显示样式

 

1.样例11

/* 类选择器     div表格位置调整，边框*/

.style1{

width:300px;

height:200px;

border :1px solid red;

margin:50px 0px 0px 200px;

}

/*父子选择器*/

table{

border:1px solid black;

width:298px;

height:180px;

 

}

/*父子选择器  文字剧中*/

table td{

border:1px solid black;

text-align:center;

}

 

 

Css 有内部css   还有外部css

内部css 就是写在本文件内部

<style type=”text/css”>

.style1{

Font-size:20px;

Color:red;

.....

}

</style>

外部css  ,写在外面的，然后调用就行

 

1.类选择器   class

2.Id选择器    id

3.Html元素选择器   

4.通配符选择器

5.

 

选择器{

属性1：属性值

属性2：属性值

 

 

}

class

.选择器{

 

 

}

 

用的时候就是class=”s1”

 

Id选择器

#id{

 

}

 

调用

Id=”id1”

 

html元素选择器！！！！ 就是选择某几个字或者某句话.可以根据所控制的东西来变化html元素选择器。

Body{

属性：属性值；

 

}

A{

 

}

P{

 

}

Tr{

 

}

Table{

 

}

 

 

代码实例:

/*类选择器*/

.s1{

background:pink;

font-weight:bold;

font-size:20px;

color:black;

}

/*id选择器*/

#id1{

background-color:gray;

font-size:30px;\

color:black;

}

/*html 元素选择器*/

body{

color:orange;

 

}

 

a:link{

color:black;

text-decoration:none;

font-size:25px;

 

}

 

a:hover{

text-decoration:underline;

font-size:35px;

}

a:visited{

color:green;

}

/*对同一种html元素分类*/

p.cls1{

color:red;

font-size:25px;

}

 

p.cls2{

color:blue;

font-size:25px;

}

 

 

通配符选择器：

*名称{

属性：属性值

}