我正在尝试自学CSS并具有以下标记:
<style type="text/css">
#content { display: block; width: 250px; height: 50px; background-color: #330000; }
/* pink */
#one { height: 25px; width: 25px; background-color: #FFCCCC; float: left; margin: 10px; }
/* hot pink */
#two { height: 25px; width: 25px; background-color: #FF0099; float: left; margin: 10px; }
/* tan */
#three { height: 25px; width: 25px; background-color: #CC9900; float: left; margin: 10px; }
/* aqua blue */
#four { height: 25px; width: 25px; background-color: #33FFFF; float: left; margin: 10px; }
/* yellow */
#five { height: 25px; width: 25px; background-color: #FFFF00; float: right; margin: 10px; }
</style>
</head>
<body>
<div id="content">
<div id="one"></div>
<div id="two"></div>
<div id="three"></div>
<div id="four"></div>
<div id="five"></div>
</div>
Run Code Online (Sandbox Code Playgroud)
页面工作正常,但我有兴趣删除CSS本身的重复代码.即所有高度,宽度,浮动都在一个定义中然后覆盖每个#id值的背景颜色
当我尝试:
#content { height: 25px; width: 25px; float: left; margin: 10px }
Run Code Online (Sandbox Code Playgroud)
然后把:
#one { background-color: #FFCCCC; }
#five { background-color: #FFFF00; float: right; }
Run Code Online (Sandbox Code Playgroud)
那没用.
基本上我正在尝试删除重复标记的数量.
我错过了什么?
你要:
#content div {
Run Code Online (Sandbox Code Playgroud)
即“从具有 id 'content' 的元素派生的所有 div 元素”
我建议阅读http://css.maxdesign.com.au/selectutorial/。
| 归档时间: |
|
| 查看次数: |
3629 次 |
| 最近记录: |