CSS中級(jí)教程快捷屬性縮寫_CSS教程
教程Tag:暫無(wú)Tag,歡迎添加,賺取U幣!
有些CSS屬性答應(yīng)一連串的屬性組合,用英文半角空格隔開即可。
margin、padding和border-width答應(yīng)你把諸如margin-top-width,margin-right-width,margin-bottom-width等用屬性: 上 右 下 左(property: top right bottom left;)組合起來(lái)。
所以:
可以概括起來(lái):
(這也可應(yīng)用到border-top,border-right等)
加入只指定兩個(gè)值(比如margin: 1em 10em;),第一個(gè)值是上和下,第二個(gè)值是右和左。
字體相關(guān)的屬性還可以聚合在font的屬性下:
(1.5是行高)
所以,組合起來(lái)吧,試試這個(gè):
很有趣吧?(看起來(lái)也應(yīng)該不難,只要你心里記住,時(shí)鐘是朝哪個(gè)方向走的——譯者注)
margin、padding和border-width答應(yīng)你把諸如margin-top-width,margin-right-width,margin-bottom-width等用屬性: 上 右 下 左(property: top right bottom left;)組合起來(lái)。
所以:
示例代碼 [hl5o.cn]
p {
border-top-width: 1px;
border-right-width: 5px;
border-bottom-width: 10px;
border-left-width: 20px;
}
border-top-width: 1px;
border-right-width: 5px;
border-bottom-width: 10px;
border-left-width: 20px;
}
可以概括起來(lái):
示例代碼 [hl5o.cn]
p {
border: 1px red solid;
}
border: 1px red solid;
}
(這也可應(yīng)用到border-top,border-right等)
加入只指定兩個(gè)值(比如margin: 1em 10em;),第一個(gè)值是上和下,第二個(gè)值是右和左。
字體相關(guān)的屬性還可以聚合在font的屬性下:
示例代碼 [hl5o.cn]
p {
font: italic bold 1em/1.5 courier;
}
font: italic bold 1em/1.5 courier;
}
(1.5是行高)
所以,組合起來(lái)吧,試試這個(gè):
示例代碼 [hl5o.cn]
p {
font: 1em/1.5 "Times New Roman", times, serif;
padding: 3em 1em;
border: 1px black solid;
border-width: 1px 5px 5px 1px;
border-color: red green blue yellow;
margin: 1em 5em;
}
font: 1em/1.5 "Times New Roman", times, serif;
padding: 3em 1em;
border: 1px black solid;
border-width: 1px 5px 5px 1px;
border-color: red green blue yellow;
margin: 1em 5em;
}
很有趣吧?(看起來(lái)也應(yīng)該不難,只要你心里記住,時(shí)鐘是朝哪個(gè)方向走的——譯者注)
相關(guān)CSS教程:
- 相關(guān)鏈接:
- 教程說(shuō)明:
CSS教程-CSS中級(jí)教程快捷屬性縮寫
。