摘要:宋體中邊框的使用宋體中邊界的使用宋體中邊框的使用宋體屬性名稱宋體屬性值宋體說(shuō)明宋體十六進(jìn)制可依序設(shè)置上,右,下,左線顏色宋體英文名稱宋體四邊均為紅色宋體三原色宋體上下為紅色,左右為綠色宋體上為紅色左右為綠
1.CSS 中邊框的使用
2.CSS 中邊界的使用
16.1 CSS 中邊框的使用
屬性名稱 屬性值 說(shuō)明
border-color 十六進(jìn)制 可依序設(shè)置上,右,下,左線顏色
英文名稱 border-color:red(四邊均為紅色)
三原色 border-color:red green
(上下為紅色,左右為綠色)
border-color:red green blue
(上為紅色、左右為綠色、下為藍(lán)色)
border-color:red green blue yellow
(上右下左分別為紅綠藍(lán)黃)
border-style none 不顯示邊線
dotted 點(diǎn)線
dashed 虛線
solid 實(shí)線
double 雙線
border-width 長(zhǎng)度 border-width:0.2cm 0.3cm 0.4cm 0.5cm;
border-width:1 2 3 4;
簡(jiǎn)化方案:border:形態(tài) 長(zhǎng)度 顏色
例如 border:1px solid black;
16.2 CSS 中邊界的使用
padding 屬性介紹
屬性名稱 屬性值 說(shuō)明
padding-bottom 長(zhǎng)度/百分比 元件下端邊線的空隙
padding-left 長(zhǎng)度/百分比 元件左端邊線的空隙
padding-right 長(zhǎng)度/百分比 元件右端邊線的空隙
padding-top 長(zhǎng)度/百分比 元件上端邊線的空隙
簡(jiǎn)易寫法:padding:10px
padding:2px 4px
padding:2px 6px 10px
padding:1px 2px 3px 4px
margin 系列屬性介紹
屬性名稱 屬性值 說(shuō)明
margin-bottom auto 自動(dòng)調(diào)整空隙
長(zhǎng)度/百分比 設(shè)置下端空隙
margin-left auto 自動(dòng)調(diào)整空隙
長(zhǎng)度/百分比 設(shè)置左端空隙
margin-right auto 自動(dòng)調(diào)整空隙
長(zhǎng)度/百分比 設(shè)置右端空隙
margin-top auto 自動(dòng)調(diào)整空隙
長(zhǎng)度/百分比 設(shè)置上端空隙
簡(jiǎn)化方案:margin:2px 4px
margin:2px 6px 10px
margin:1px 2px 3px 4px
常用網(wǎng)頁(yè)頂格設(shè)置:margin:0;
CSS 1CSS 中邊框的使用
中邊框的使用 中邊界的使用
padding 屬性介紹 |
CSS 中邊界的使用 padding 屬性介紹 屬性名稱 屬性值 說(shuō)明 padding-bottom 長(zhǎng)度/百分比 元件下端邊線的空隙 padding-left 長(zhǎng)度/百分比 元件左端邊線的空隙 padding-right 長(zhǎng)度/百分比 元件右端邊線的空隙 padding-top 長(zhǎng)度/百分比 元件上端邊線的空隙 簡(jiǎn)易寫法:padding:10px padding:2px 4px padding:2px 6px 10px padding:1px 2px 3px 4px margin 系列屬性介紹 屬性名稱 屬性值 說(shuō)明 margin-bottom auto 自動(dòng)調(diào)整空隙 長(zhǎng)度/百分比 設(shè)置下端空隙 margin-left auto 自動(dòng)調(diào)整空隙 長(zhǎng)度/百分比 設(shè)置左端空隙 margin-right auto 自動(dòng)調(diào)整空隙 長(zhǎng)度/百分比 設(shè)置右端空隙 margin-top auto 自動(dòng)調(diào)整空隙 長(zhǎng)度/百分比 設(shè)置上端空隙 簡(jiǎn)化方案:margin:2px 4px margin:2px 6px 10px margin:1px 2px 3px 4px 常用網(wǎng)頁(yè)頂格設(shè)置:margin:0;
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.specialneedsforspecialkids.com/yun/1044.html
摘要:會(huì)在元素內(nèi)容而不是元素后插入一個(gè)偽元素使用意味著中新增的子元素會(huì)被清除左右浮動(dòng)元素。這一篇主要介紹了盒子模型,浮動(dòng)和清除。 這是CSS設(shè)計(jì)指南的讀書筆記,用于加深學(xué)習(xí)效果。 上一篇介紹了css 的工作原理,這一篇主要介紹盒子模型和浮動(dòng)。 盒子模型 所謂盒子模型,就是瀏覽器為頁(yè)面中的每個(gè)HTML元素生成的矩形盒子。這些盒子們都要按照可見版式模型在頁(yè)面上排布。 可見的頁(yè)面版式主要由三個(gè)屬性...
摘要:會(huì)在元素內(nèi)容而不是元素后插入一個(gè)偽元素使用意味著中新增的子元素會(huì)被清除左右浮動(dòng)元素。這一篇主要介紹了盒子模型,浮動(dòng)和清除。 這是CSS設(shè)計(jì)指南的讀書筆記,用于加深學(xué)習(xí)效果。 上一篇介紹了css 的工作原理,這一篇主要介紹盒子模型和浮動(dòng)。 盒子模型 所謂盒子模型,就是瀏覽器為頁(yè)面中的每個(gè)HTML元素生成的矩形盒子。這些盒子們都要按照可見版式模型在頁(yè)面上排布。 可見的頁(yè)面版式主要由三個(gè)屬性...
摘要:你也可以單獨(dú)設(shè)置某一個(gè)邊的三個(gè)不同屬性,如,等。屬性設(shè)置與元素相關(guān)聯(lián)的盒子模型的左外邊距。首先是我們的代碼然后是代碼上述代碼產(chǎn)生以下結(jié)果輪廓輪廓最后,還有重要的一點(diǎn),一個(gè)框的是一個(gè)看起來(lái)像是邊界但又不屬于框模型的東西。注:全文摘要自網(wǎng)絡(luò)開發(fā)者網(wǎng)站,當(dāng)然間隔也會(huì)整理一些思路和格式排版添加進(jìn)去。 CSS框模型(譯者注:也被稱為盒模型)是網(wǎng)頁(yè)布局的基礎(chǔ) ——每個(gè)元素被表示為一個(gè)矩形的方框,框的內(nèi)容...
摘要:屬性是中最重要的用于控制布局的屬性。布局的高度多數(shù)情況下,布局中結(jié)構(gòu)化元素乃至任何元素的高度是不必設(shè)定的。更新效果如圖以上措施使布局有了明顯改觀。 這是《CSS設(shè)計(jì)指南》的讀書筆記,用于加深學(xué)習(xí)效果。 display 屬性 display是 CSS 中最重要的用于控制布局的屬性。每個(gè)元素都有一個(gè)默認(rèn)的 display 值。對(duì)于大多數(shù)元素它們的默認(rèn)值通常是 block 或 inline ...
摘要:屬性是中最重要的用于控制布局的屬性。布局的高度多數(shù)情況下,布局中結(jié)構(gòu)化元素乃至任何元素的高度是不必設(shè)定的。更新效果如圖以上措施使布局有了明顯改觀。 這是《CSS設(shè)計(jì)指南》的讀書筆記,用于加深學(xué)習(xí)效果。 display 屬性 display是 CSS 中最重要的用于控制布局的屬性。每個(gè)元素都有一個(gè)默認(rèn)的 display 值。對(duì)于大多數(shù)元素它們的默認(rèn)值通常是 block 或 inline ...
閱讀 3244·2021-11-22 12:07
閱讀 1885·2021-10-12 10:11
閱讀 1048·2019-08-30 15:44
閱讀 2948·2019-08-30 12:45
閱讀 2200·2019-08-29 16:41
閱讀 1644·2019-08-29 16:35
閱讀 2632·2019-08-29 12:57
閱讀 1156·2019-08-26 13:51