本文介绍了HTML中电子邮件连接设置、超链接行为控制、热点区域定义等实用技巧，并深入探讨了CSS3的选择器使用方法，包括标记、类、ID、全局、组合、继承及伪类选择器等，同时详细讲解了属性选择器的各种形式及其应用场景。
1、设置电子邮件连接：<a href = "mailto:chaoyue@163.com">163邮箱 </a>
2、a标签中的_bland、和_self；分别表示在新窗口中打开和在当前窗口显示超链接内容
3、热点区域：
<img src = "图片地址" usemap = "#名称">
<map id = "#名称">
<area shape = "rect" coords = " 10,10,100,100" href = "#"> <!- - 矩形 ：coords：分别表示距离左上角和右下角坐标值- - >
<area shape = "circle" coords = " 10,10,100" href = "#"> <!- - 原形 - - coords：分别表示圆心坐标和半径像素值>
<area shape = "poly" coords = " 10,10,100,100、26,89" href = "#"> <!- - 多边形 - - coords：分别表示各个边的的坐标 >
</map>
4、表单提交前不能为空的判断属性：required="required"；适合的text，search，url，email， password，date，pickers，number，checkbox，radio
5、css3选择器，
标记选择器 eg：p{ color： red}；
类选择器eg：.divcolor{ color：red}；
Id选择器eg：#test{ color：red}；
全局选择器eg：*{color：red}
组合选择器eg：h1.color{color：red}
继承选择器eg：.test span img {border：1px blue solid}
伪类eg：：first-child、：link、：vistited、：hover、
属性选择器：
E[foo]：标签中包含foo
E[foo="bar"]：标签中包含foo="bar"
E[foo~="bar"]：标签中包含bar并还有其他通过空格符间隔的元素 eg：a[title~="b1"] 匹配 <a title="b1 b3 b4"></a>
E[foo|="en"]：标签中包含foo并通过连字符连接的其他属性，且以en开头 eg：[lang|="en"] 匹配 <body lang = "en-us"></body>
E[foo^="en"]：标签包含foo并并且前缀是en eg：body[lang^="en"] 匹配 <body lang="en-us"></body>
E[foo$="en"]：标签包含foo并且属性已en为后缀 eg：img[src$="jpg"] 匹配 <img src="p.jpg">
6、结构伪类选择器
E：root ；匹配文档根元素
E：nth-child(n) ；匹配父元素下的第n个子元素 n=0 1 2 3 4 5 6.....
E：nth-last-child(n) ；匹配父元素下倒数第n个子元素n=0 1 2 3 4 5......
E：nth-of-type(n) ；匹配父元素下同种标签的第n个元素
E：nth-last-of-type(n) ；匹配父元素下同种标签的倒数第n个元素
E：last-child ；匹配父元素的最后一个子元素
E：first-of-type ；匹配父元素下同种标签的第一个子元素
E：last-of-type ；匹配父元素下同种标签的最后一个子元素
E：only-chold ；匹配父元素下仅有的一个元素
E：only-of-type ；匹配父元素下同种标签仅有的一个元素
E：empty
；匹配父元素下没有任何子元素
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
