html之css、重要标签

css:层叠样式表

标签选择器

后代选择器

代码

<div id="div1" class="c1">    <div>        <p class="c2">哎呀，厉害了</p>    </div>    <p class="c2">忘记你了，O(∩_∩)O哈哈~</p></div><span>啦啦啦~</span><p class="c3">你猜他是谁？</p>

#div1 p{    background-color: darkgreen;}

div1后面需要加一个空格代表后代

子代选择器

代码

#div1>p{    background-color: darkgreen;}

‘>’代表子代

毗邻选择器

代码

#div1+p{    background-color: darkgreen;}

用‘+’代表毗邻，必须两个同级标签紧紧的紧紧的紧紧的挨着，向下起作用

兄弟选择器

代码

#div1~p{    background-color: darkgreen;}

用‘~’代表兄弟，只要是同级标签就可以，不需要紧挨着，向下起作用

重要标签

1. form 表单（name和value）
2. label 标签
3. ol 有序列表
4. ul 无序列表
5. table 表格
6. div（块级标签）和span（内联标签）

多选框

<select name="sel" id="s1" multiple="multiple">    <option value="big" selected="selected">大哥</option>    <option value="small">小哥</option>    <option value="black">黑社会</option>    <option value="bigsmall">大小哥</option></select>

属性名和属性值相同时，可以只写属性名，如下：

<select name="sel" id="s1" multiple>    <option value="big" selected>大哥</option>    <option value="small">小哥</option>    <option value="black">黑社会</option>    <option value="bigsmall">大小哥</option></select>