首页 > 代码库 > 样式表与布局

样式表与布局

   样式表理解起来很简单,与前面类似。实际上就是加一个标签来控制我们想要控制的那部分内容的格式。选择器是对不同标签的几种不同的表示方法,和选择方法。而对于布局来说,控制一个元素的属性同样很好理解,也是加一个标签,只不过样式表和布局的标签不同。不过对于它的位置我绕了半天。书上有一段代码是这样写的:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.b{
border: 5px solid blue;
widows: 100px;
height: 100px;
margin: 10px;
background-color: #00FF33;
right: 50px;
bottom: 20px;
position: absolute;
}
.c
{
border: 2px solid red;
width: 400px;
height: 200px;
}
.d
{
border: 2px solid red;
width: 400px;
height:200px;
position: absolute;
}
</style>
</head>
<body>
<div class="c">c
<div class="b">b</div>
</div>
<div class="d">b
<div class="b">bb</div>
</div>
</body>
</html>

我不明白的是b是写在c里面的,bb写在b里面,可是为什么bb在b的框架内,而b却不在c的框架内。后来才发现c没有定义位置属性。所以b的框架相当于整个浏览器。

样式表与布局