1.设置CSS样式的三种方式
①在HTML标签内设置，仅对当前标签有效
<div style="border: 1px solid black;width: 100px; height: 100px;"> </div>
②在head标签内设置，对当前页面有效 要是标签之间 标签名{} id的话是#id名{} class的话是 .class名{} 也可以使用 #id名 下面子标签名{}
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
.one {
border: 1px solid black;
width: 100px;
height: 100px;
background-color: lightgreen;
margin-top: 5px;
}
</style>
</head>
<body>
<div style="border: 1px solid black;width: 100px; height: 100px;"> </div>
<div class="one"> </div>
<div class="one"> </div>
<div class="one"> </div>
</body> 
③引入外部CSS样式文件 需要在外部文件.css中写入样式，语法同样。
在需要使用这个CSS文件的HTML页面的head标签内加入：
<link rel="stylesheet" type="text/css" href="css/demo01.css"> 
2.CSS中的绝对定位absolute 和相对定位relative
在对div进行位置定义时，除了可以用margin或者padding外，还可以使用
absolute -- 绝对定位 , 需要配合使用 left , top
#div1{width:200px;
height:50px;
background-color:greenyellow;
/* 绝对定位 */
position:absolute;
left:100px;
top:100px;}relative -- 相对定位 , 一般会和 float , margin , padding .... 一起使用
#div2{
width:200px;
height:50px;
background-color:pink;
position:relative;
float:left;
margin-left:20px;
}
1241
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
