知识点七、字间距:letter-spacing。letter-spacing 属性增加或减少字符间的空白(字符间距)。该属性定义了在文本字符框之间插入多少空间。由于字符字形通常比其字符框要窄,指定长度值时,会调整字母之间通常的间隔。因此,normal 就相当于值为 0。
<style>
p span{letter-spacing: 20px;}/*字间距*/
</style>
<p> 一些年之后,我要跟你去山下人迹稀少的小镇生活。<span>清晨爬到高山巅顶</span>
</p>
知识点八、外边距:margin。margin 简写属性在一个声明中设置所有外边距属性。该属性可以有 1 到 4 个值。
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
*{margin:0;padding: 0;}
div.box{
width: 800px;
height: 500px;
background: red;
/*解决 塌陷现象 的方法如下:*/
/*1、position: absolute;*/
/*2、overflow: hidden;*/
/*3、float: left;*/
/*4、border:1px solid transparen(透明色);*/
/*5、padding: 1px;*/
}
div p{
width: 300px;
height: 300px;
background: green;
/*上右下左*/
/*margin:20px 25px;当只有两个值,第一个代表x轴,第二个代表y轴*/
/*margin:20px 30px 40px;上 左右 下
当只有三个值,顺数过里啊,被省略掉的跟剩下的一方相等。*/
/*margin:20px;当只有一个值,则代表四个方向共同采用一个值*/
/*margin:0 0 0 50px;4个值的写法*/
/*margin-left: 50px;单个方向的写法*/
margin-top: 20px;
/*margin-left: 30px;
margin-bottom: 40px;
margin-right: 30px;*/
}
</style>
</head>
<body>
<div class="box">
<p></p>
</div>
</body>
</html>
知识点九、隐藏溢出内容:overflow:hidden。
比如:
<div style="width:300px;overflow:hidden" id=1>
<div id=2></div>
<div>
当ID=2的这个DIV高度设定的宽度超过了300px,那么超出的部分将自动被隐藏。
知识点十、背景:background。背景的属性有很多,下面将列举一些常用的背景属性:
(在设置背景图片的时候,建议同时设置背景颜色,以免图片加载失败时,网页内容与默认背景色重合,造出视觉错误)background-image: url("../img/01.jpg");//背景图片background-position: center center;//背景位置,xy轴居中background-repeat: no-repeat;//背景图片是否平铺,不平铺background-size:80%;//背景图片的比例background-color: pink;//背景颜色:粉色
/*background连写的方法:
background: black url("../img/01.jpg") no-repeat 0 0;background: 颜色 图片 重复程度 图片定位*/
新闻热点
疑难解答