5 css中的border屬性

2021-09-24 06:51:58 字數 1596 閱讀 3583

"zh">"child">

複製**

border 簡寫屬性在乙個宣告設定所有的邊框屬性。

border :1px solid #000;可拆分為border-width:1px;寬度border-style:solid;樣式(實線)border-color:#000;顏色

可以看到,寬度、顏色、樣式這個三個屬性的屬性值互相不會衝突,瀏覽器在解析的時候可以區分他們

可以顛倒三個屬性值的順序

例如border :solid #0001px;border :#000solid 1px;

在開發中,尤其是團隊配合時,需要有個統一的寫法,便於理解,有良好的可讀性,預設按照border :1px solid red;的順序

可以不寫其中的乙個或多個

不寫顏色時,預設使用前景色,即color屬性

border :1px solid;等同於border :1px solid #000;因為color屬性預設值時#000

不指定border-style是看不到效果的,常用的solid(實線)、dotted(點線)、dashed(虛線)可以借助開發者工具自行體驗下

border :1px solid #000;還可拆分為

border-top:1px solid #00;border-right:1px solid #000;border-bottom:1px solid #000;border-left:1px solid #000;

border-top:1px solid #000;又可拆分為

border-top-width: 1px;border-top-style: solid;border-top-color: #000;

神奇的border屬性

結合前面的文章,我們已經認知了css盒模型的widthheightpaddingmarginborder這五個屬性,也初步闡述了html、css的基本常識,以及開發者工具的簡單使用。

很多地方直接放截圖,是希望能夠自己動手敲**,而不是黏貼複製,更好的方式是閱讀完一小段在去自己嘗試,而不是邊看邊敲!

保持好奇是很重要的,每天多學一點,相信未來是不可限量的!知識首先在於積累,不要有太多的功利性。

上一章 - 4 display屬性對其他css屬性的影響

5 css中vh和vw的屬性

響應式網頁設計技術很大程度上依賴於比例規則。然而,css比例不總是每個問題的最佳解決方案。css寬度是相對於最近的包含父元素。如果你想使用顯示視窗的寬度或高度而不是父元素的寬度將會怎麼樣?這正是vh和vw單位所提供的。vh等於viewport高度的1 100.例如,如果瀏覽器的高是900px,1vh...

css中的border屬性。。。。。

1.border color 邊框的顏色 一般設定邊框都有3個屬性 寬度 線的樣式 顏色,如果寬度設定了很多px,那麼就可以給邊框設定很多顏色,讓邊框顯示出漸變的效果,不過設定邊框不同顏色時只能通過border bottom colors,border top colors,border left ...

新人筆記5,css基礎屬性。

rgb red greed bule 0,10,256 0010ff css中顏色的表示方法 1 預定義顏色 bule red,black。2 十六進製制顏色 0f0f0f 3 rgb顏色 128,0,0 全紅 4 rgba,在rgb的基礎上又新增了表示透明度的alpha 5 hsl 用色調,飽和度...