100 個(gè)太多,但這九 個(gè) Css 屬性你必須要知道!
01:外部形狀控制
使用 shape-outside 屬性控制定義文本如何環(huán)繞 HTML 元素。此屬性對(duì)于浮動(dòng)元素特別有用。定義的形狀決定了文本圍繞該元素的流動(dòng),使文本能夠平滑地環(huán)繞非矩形形狀。
圖片
02:滾動(dòng)捕捉類型
使用 scroll-snap-type 屬性用于在滾動(dòng)容器內(nèi)實(shí)現(xiàn)對(duì)齊點(diǎn)之間的平滑過(guò)渡。此功能可確保用戶滾動(dòng)瀏覽頁(yè)面時(shí)內(nèi)容部分整齊對(duì)齊,從而提供更結(jié)構(gòu)化的用戶體驗(yàn)。此scroll-snap-type屬性控制沿水平軸或垂直軸的滾動(dòng),并定義如何接合對(duì)齊點(diǎn)。
圖片
03:圖像渲染
使用 image-rendering 性用于確定應(yīng)如何呈現(xiàn)圖像。它告訴瀏覽器在縮放或調(diào)整圖像大小時(shí)應(yīng)使用哪種算法。此屬性對(duì)于 Web 開(kāi)發(fā)人員在放大或縮小圖像時(shí)保持質(zhì)量特別有用。
圖片
04:混合模式
使用 mix-blend-mode 可以用來(lái)混合兩個(gè)或多個(gè)圖層的顏色。此屬性將一個(gè)圖層的顏色與其下方的圖層的顏色混合,在屏幕上創(chuàng)建不同的視覺(jué)效果。它在處理背景、重疊元素和圖像時(shí)特別有用。
圖片
05:背景剪輯
使用 background-clip 屬性決定如何剪裁背景。此屬性控制背景是否延伸到內(nèi)容框的邊緣,或者是否被剪裁到內(nèi)邊距和邊框區(qū)域。
圖片
06:背景濾鏡
使用 backdrop-filter 屬性允許我們對(duì)元素后面的內(nèi)容應(yīng)用各種效果。它通常用于模糊背景、更改背景顏色或添加陰影
圖片
07:背面可見(jiàn)性
使用 backface-visibility 屬性決定元素在 3D 空間中旋轉(zhuǎn)時(shí)其背面是否可見(jiàn)。如果背面不可見(jiàn),瀏覽器就不會(huì)渲染它,從而提高性能
圖片
08:文本強(qiáng)調(diào)
使用 text-emphasis 屬性于強(qiáng)調(diào)文本塊中的某些字符。
圖片
09:禁止用戶選擇
使用 user-select 來(lái)管理用戶是否可選擇文本的事件。指定為 none 將無(wú)法選擇