CSS 初印象 一

2021-08-11 17:04:48 字數 1664 閱讀 2144

今後的側重都會在前端方面,我們的目標是什麼?高階前端!!!(前路漫漫 no diss)

我是分割線,自我鼓勵完,下面我們今天要分享的是關於 css 的二三事。

css 可以做出很美的布局,它的使用被人稱之為簡單,其實與非並沒有這樣的感覺,下面是與非最近在學習 css 原始碼的時候關注到的點,積累在這裡。

1)overflow:hidden; 隱藏溢位,即超出高度和寬度的部分會隱藏掉。

2)z-index:100; 幾個層疊的 css 根據這個值決定誰在最上層,引數值越大則在最上面。

3)white-space:pre; 設定如何處理元素內的空白。常用到的有 pre 和 nowrap 兩個值。

pre:空白會被瀏覽器保留。

nowrap:文字不會換行,在同一行上繼續,直到遇到 『br』 標籤。

4)cursor:default; 規定要顯示的游標的型別(形狀)。default 表示預設游標,通常是乙個箭頭;pointer 游標呈現為指示鏈結的指標(乙隻手)。

5)zoom:1; 解決 ie 問題的乙個屬性。允許擴大或縮小元素。

6)display:none; 此元素不會被顯示,常用到的一句話。

7)!important; !important 的出現是為了讓使用者自己設定被執行語句的優先順序。

8)content:」.」; 這個屬性在我看來也很重要,在很多地方用到,與 :before 及 :after 偽元素配合使用,來插入生成內容。

9)border-collapse:collapse; border-collapse 屬性設定**的邊框是否被合併為乙個單一的邊框,還是像在標準的 html 中那樣分開顯示。

10)clear:left; clear 屬性規定元素的哪一側不允許其他浮動元素。

11)letter-spacing:1px; 這個屬性不常用到,是用來檢索或設定物件中的文字之間的間隔。

12)filter:progid:dximagetransform.microsoft.gradient

(gradienttype=0,startcolorstr=』#ffe9e9e9』,endcolorstr=』#00e9e9e9』);

這個很神奇,是為了產生一種自帶濾鏡漸變效果。語法如下:

filter:progid:dximagetransform.microsoft.gradient(enabled=benabled,startcolorstr=iwidth,endcolorstr=iwidth)

enabled 表示可選項。設定或檢索濾鏡是否啟用 ( true | false )。

true::預設值。濾鏡啟用。

false:濾鏡被禁止。

startcolorstr:字串(string)。設定或檢索色彩漸變的開始顏色和透明度。

gradienttype:整數值(integer)。設定或檢索色彩漸變的方向。1 是水平漸變,0 是垂直漸變。

endcolor:整數值(integer)。設定或檢索色彩漸變的結束顏色。

13)display:flex; 中文翻譯為彈性布局,父級元素有 display:box; 屬性之後。他的子元素裡面加上 box-flex 屬性。可以讓子元素按照父元素的寬度進行一定比例的分佔空間。

好啦我們今天的 css 初印象非常初級的部分就到這裡了,與非希望下週會高階。謝謝。

蘇州初印象

都說可以從博物館看到一座城市的興衰發展,看得越多越覺得是在表達中國上下五千年的歷史程序。博物館的敘述方式彷彿流水賬,也可說是編年體,歷史總體的程序往往比作車輪滾滾,個體的發展就是沿著那些車輪碾過的痕跡。蘇州就像乙個勤奮好學的學生,在每一段歷史中都留下了自己濃墨重彩的一筆。蘇州的文化底蘊很深,深到有種...

《Falcon 初印象》幻燈分享

今天 五月三日 下午,與 qichangxing,phaytsukiming,heyfluke,linluxiang,vonbo,qingliangcn,benky52 等約13人在廣州紅專廠藝術區的黑膠咖啡館聚會。大家可以通過 gztechparty 這個 tag 在 twitter 上看這個過程...

戰略覆盤初印象

首先為什麼要有這種形式的覆盤,其次是這種形式的覆盤有什麼特點,最後是這種覆盤如何去做呢?我們在做專案的時候需要不斷從過程中總結學習,而企業在經營的過程中也需要進行學習。那麼這種覆盤如何去做呢?1 定期開展可以和季度總結年度總結一起來進行 2 要有回顧和分析。回顧就是回顧之前制定的方案和策略。分析是要...