【CSS】CSS在HTML文件中的引入方式，浮动和清除浮动

1.CSS在HTML文件中的引入方式

行内式

<div class="fr" style="color:red;">aa</div>

内嵌式

<style>
    .one {
        width: 200px;
        }
</style>

外链式

<link rel=”stylesheet” href =”css/base.css” />

2.浮动

• 浮动目的：可以让多个块级元素放到一行上
• 浮动类别：float: left right none

• 正常流：normal flow

  注：一个大盒子里面有多个小盒子，其中某个小盒子设置浮动，则所有的小盒子都要设置浮动

3.清除浮动

1. 时间：根据实际需要来清除浮动
2. 目的：为了解决父盒子塌陷的问题
3. 方法：
   
   1. 额外标签法
   2. overflow: hidden
   3. 伪元素

css
.clearfix: after{
    content:””;
    Visibility:hidden;  
    Display:block; 
    Height:0;
    Clear:both;
}

css
.clearfix{
    Zoom:1;
}

4. 双伪元素

.clearfix:before,.clearfix:after{
    display: table;
    content: "";
}

.clearfix:after {
    clear: both;
}

.clearfix {
    zoom: 1;
}

备注

Font 字体

Font: 字体加粗 字号/行高 字体; 必须有字号和字体。
Font-weight:bold; 约等于700 ，正常是400

• S del 删除线
• I em 倾斜
• U ins 下划线

注：这些小标签主要用于写一些小图标，例如：淘宝的购物车图标等。尽量不用div，div主要用于布局使用