css初学者那些你容易忘记但有很有用的知识点

1. 写一个小页面(页面的一部分)的基本步骤
   1.添加页面需求的元素，由大的块元素包裹之类元素
   2.编写样式控制添加好的页面元素
   3.微调编写好的样式，并调优

   <!-- 1.添加页面需求的元素，由大的块元素包裹之类元素 -->
   <!-- 2.编写样式控制添加好的页面元素 -->
   <!-- 3.微调编写好的样式，并调优 -->
   

2. 将文本文件居中的方法

    text-align: center;
   

3. 将图片完全拉伸

4.  width: 100%;
   

   也即填充其父类
5. 将div元素居中的方法

    margin: 0 auto;
   

6. 清空漂浮
   在上面使用漂浮后要是下一个元素不想要横线放置就需要清空漂浮
   解决方法：
   • 对于内容固定的元素，如果子元素都浮动，可以给父元素固定高度(例:导航栏)
   • 在父元素的末尾添加空的块元素。设置 clear:both; 清除浮动(但是多了一个元素的增加)
   • 为父元素设置 overflow:hidden; 解决高度为0
7. 通过伪类去寻找元素
   如寻找下列的div不用标签改如何寻找？

   <div id="pic">
        <div>低价</div>
        <!-- 清除浮动 -->
        <div></div>
        <div>母婴馆</div>
        <div>秒杀低至一元</div>
        <div><img src="imgs/img01.png" alt=""></div>
    </div>
   

   可以用 #pic>div:nth-child(n) 进行寻找
8. 鼠标移动上去聚焦
   在style中运用:hover即可
9. 在图片中打开指定的网页，嵌入另一个网站
   使用iframe即可，但是并不常用，启动时消耗比较大，但是也是一种方式。
10. 表单元素设置相互排斥
    比如在设置单选按钮的时候可以通过name设置相同来设置按钮选择相互排斥