学习css也有一段时间了,有些小小的知识点,感觉可以小小的聚记录一下。
一、ul 的 <li>标签的项目符号和文字处于中线位置
最开始我是这样写的
ul { list-style : none; } ul li { list-style-images : url ("images/image.png"); }
发现并没有什么用,项目符号为图片的时候,总是无法像默认的符号一样,和文字一起处于中线,后来发现为什么不可以作为背景呢
ul { list-style : none } ul li { height: 23px; line-height: 23px; font-size: 10px; background: url('../images/image.png')8px center no-repeat; }
然后呢就实现了 嘿嘿
二、float等的一些属性
我们经常看见一些网页上的左右布局,而那些<div>标签是一些块状元素 ,总会霸道的强占一行元素,所以我们需要用到float属性,达到这样的布局
那么是怎么实现的呢
<div class="left" style="width: 200px ; height: 80px ; float: left ; background-color: red"> </div> <div class="right" style="width : 200px ;height: 80px ;overflow: hidden ; background-color:blueviolet"> </div>
是不是很简单呢,通过一个float属性和overflw属性就实现了
当你做到一些事的时候就会想那么在下面在加上一块怎么办呢
扫描二维码关注公众号,回复:
548920 查看本文章
也就是这样的情况
下面就是实现的代码
<div class="left1" style="width: 200px ; height: 80px ; float: left ; background-color: red">
left1
</div>
<div class="left2" style="width: 200px ; height: 80px ;float: left; clear: both; background-color: gold">
left2
</div>
<div class="rights" style="width : 200px ;height: 160px ;overflow:hidden ; background-color:blueviolet">
right
</div>
嘿嘿,就是加入一个clear属性,那么就可以让left2识别left1的属性啦