::after ::before

普通

ＨＴＭＬ

<strong class="amount"><span>$ </span>700<span> 萬元</span></strong>

ＣＳＳ

.amount {color:red;}

這樣會是整個 $ 700 萬元 都變成紅字

使用後

.amount::before {content:"$ "; color:blue;}
.amount::after {content:" 萬元"; color:blue;}

結果會像 $ 700 萬元，先前定義的紅字還是存在。 ::before, ::after 沒有限制兩個同時都要指定，也可以只指定一個前或一個後。

使用after他就會將那段css加到div的後面

反之before就是前面

float搶救跑版

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