day5 浮動,偽元素,五環的製作

2021-08-28 07:29:53 字數 829 閱讀 8730

今天來講講浮動。

當我們引用表單標籤ul、li時,我們不難發現呈現的是縱向的,那如果我們想把文字橫向呈現該怎麼做呢?

接下來引入乙個浮動元素:float;

在多個li的css檔案中,引入:

li

這樣一來,我們就可以將縱向的文字變為橫向。

這種設定在大多數網頁上都非常常見,是一種很好用的方法。

在引入浮動的同時,肯定也有清除浮動了:

clear:both;

可清除浮動。

同時今天再介紹乙個元素,叫偽元素。

其實我們每個標籤中都有兩個潛在的偽元素,我們看不到,需要通過**將它們引用。

舉個簡單的例子我們用span

456
而在css中引出偽元素

span::before

span::after

最後我們執行後發現:

今天最後還製作了五環…

html中

css中將這五個圓環進行修飾和整改。

.circle1,

.circle2,

.circle3,

.circle4,

.circle5

.circle1

.circle2

.circle3

.circle4

.circle5

——-在努力,再努力

Day5 今天學會了CSS浮動呀!

今日進度 205 528,學習了css04的浮動部分以及05開始做案例header部分 廢話不多說,開始上學習內容的截圖啦 一 主要學習了浮動以及清除浮動的內容 1 為什麼要有浮動?因為當兩個行內塊元素合併在一起時,中間是有縫隙的,使用浮動屬性能夠讓它們之間沒有縫隙 2 浮動有三個特性,分別是脫標 ...

CSS偽元素 偽元素消除浮動 偽類

一 css 偽元素用於向某些選擇器設定特殊效果。1 first line 偽元素 first line 偽元素用於向文字的首行設定特殊樣式。p first line 注釋 first line 偽元素只能用於塊級元素。注釋 下面的屬性可應用於 first line 偽元素 值描述 none 預設。定...

隨堂筆記day5

string判斷相不相等要使用 equals 不能使用 號 表示非,將true變成假,false變成真 username.equals kkkkkkkkk string不等於表示方式。位運算子 現將運算元據轉化為二進位制,再運算。2 1 4左位移運算子,相當於乘2操作,乘4位移2位,反之。速度快 4...