Home >Web Front-end >HTML Tutorial >《HTML5权威指南》_html/css_WEB-ITnose
Adam Freeman 著 谢廷晟 牛化成 刘美英 译 人民邮电出版社。共34章。
零散也是一种 系列!玩也是一种 态度。
1-20章:1、自定义属性data-开头,作用是为了避免与HTML未来版本中可能增加的属性名相冲突。2、XHTML即 HTML的序列化形式,以XML规范表达内容和HTML的元素和属性,以便XML解析程序处理。3、HEAD标签中的元素属于元数据,包括title。4、accesskey="n",窗口系统下,按下ALT+n即可将焦点转移到该元素。5、tabindex属性,用法tabindex="-1/1/2/3",用户按下TAB的过程中,焦点依次从1到2到3。-1时跳过相应元素。6、CSS中@import的效率不如多个元素。7、CSS使用的三种方式(名次),元素内嵌style属性、文档内嵌、外部引用。8、JavaScript删除属性,delete object.prop; OR delete object['prop'];。判断对象是否具有某个属性,in,var hasProp = "prop" in object;9、JavaScript基本类型的比较是值的比较,对象的比较是引用的比较。10、JavaScript基本类型,String(5) OR Number("5")。11、
14、文档中有一种脚本肯定不会与HTML元素发生相互作用或者产生关系。可以用async属性异步加载脚本来提高其性能,如跟踪脚本。15、元素对搜索引擎很重要。其中包括了很多信息,如application name OR author OR description OR keywords。
16、添加网站标识。如果网站标识文件位于服务器根目录,那就不用使用该属性,浏览器会自动载入。17、margin-start/margin-end/margin-before/margin-after。类似margin-left/margin-right/margin-top/margin-bottom。非通用。18、
<details> <summary>this is summsary</summary> this is content. </details>
19、form标签的name属性不会提交到服务器。其子元素的name属性会提交到服务器。20、fieldset元素对表单进行分组。label元素的for属性设置为对应input的id值,将input元素和label元素关联起来。
<fieldset> <legend>this is legend</legend> <p> <label for="name">Name:<input id="name" name="name" /></label> </p></fieldset>
21、disabled属性对应元素的数据不会发送到服务器。22、。label设置选项组的一个标题或说明。23、。for属性的值是元素的ID。24、for属性可以将元素关联起来。甚至不用标签包裹就可以相关联。个人感觉这种方式不好,包裹起来更利于维护。25、感觉这些用法很少用。span.class1.class2可以指定不同的类名。[attr~="val"],属性中包含某值。如[class~="red"]表示class属性中含有red值的元素。p span含有空格,表示
标签中所有的标签。p>span直接后代,即子元素。p+a返回p元素之后相邻的一个span元素。p~a,表示p元素之后同级的的所有a元素。26、伪类一个冒号,如:first-child;伪元素两个冒号,如::before。尽管浏览器都当做一个冒号处理,但是为了向后兼容最好区分写法。27、:only-child返回只有一个子元素的元素的子元素。也就是返回没有同级元素的元素。:only-of-type返回一个独有的元素,即该元素和其他元素都不相同。:nth-child(n) OR :nth-last-child(n)选择父元素的第n个子元素与父元素的倒数第n个元素。p:nth-of-type(2) OR p:nth-last-of-type返回第二个p元素与返回倒数第2个p元素。28、em与元素的字号挂钩。font-size: 15pt; height: 2em即2倍字体高度。rem与根元素的字号挂钩。html {font-size: 0.2in;} p {font-size: 2rem; height: 2em;}。font-size: 2rem表示该钙元素字号为根元素字号的2倍。29、border-radius可以用数值或者百分数。百分数值是相当于元素盒子的宽度和高度来说的。border-top-left-raidus: 20px 15px;分别表示水平半径和垂直半径。border-radius: 20px / 15px;用/将水平半径和垂直半径分开。border-radius: 50% 20px 25% 5em / 25% 15px 40px 55%;用/分开的是水平和垂直半径。第一组是四个角的水平半径、第二组是四个角的垂直半径。从top-left到top-right到bottom-left到bottom-right。