HTML&CSS前端开发知识点大纲了解web标准、浏览器内核差异、兼容性、hack、CSS基本技能：布局、盒模型、选择器优先级、HTML5、CSS3、Flexboxdoctype语句必须位于HTML文档的头部。在标签之前，HTML5中不区分大小写的声明并不是HTML标签，而是告诉浏览器当前HTML版本的指令。现代浏览器的HTML布局引擎通过检查doctype来决定以Compatibility还是Standards模式呈现文档，一些浏览器已经接近Standards模式。在HTML4.01中，声明指向一个DTD。由于HTML4.01基于SGML，DTD指定标记规则以确保浏览器正确呈现内容。HTML5不是基于SGML，所以不需要指定DTD的通用dotype：HTML4.01strict:Presentational，不允许使用过时的元素（如字体）和frameset。声明：HTML4.01Transitional:Permissiontousepresentational,过时的元素（如字体），框架集是不允许的。声明：HTML4.01Frameset:Allowsexpressiveelement、排气元件和车架组。声明：XHTML1.0Strict:NotallowedPresentation、弃用的元素和框架集。文档必须是格式正确的XML文档。声明：XHTML1.0Transitional:允许有表现力和过时的元素，不允许框架集，文档必须是结构良好的XMl文档。声明：XHTML1.0框架集：允许展示性的、过时的元素和框架集，并且文档必须是格式正确的XML文档。声明：HTML5:html语义，下面我把我对一些标签的语义的理解详细列举一下：pbr先说最简单的吧。小节应该使用p标签而不是br（即使连续两个）。这似乎不用多说。但有时我们不得不放弃这个原则。一个常见的例子是论坛帖子，如果我想分解它，我按回车键。而这样传到后台显示的东西，显然是分段的。tableth大力提倡div+css的结果，好像谁用table布局，谁就是不文明的土生土长。但我认为这种观点是不正确的。table的意思就是表格，所以任何应该以表格形式出现的数据，还是应该放在表格里。一个简单的例子就是班级的同学花名册，包括姓名、学号、性别等，这显然是一种表格形式的数据，所以应该以表格的形式进行排版。另一个值得讨论的例子是博客中的日历导航。我看过一个博客程序，它的日历导航中的所有日期，从1号到30号，都设置在div中，然后使用float:left样式，将当月的日历排成7行。当我取消浏览器的CSS显示时，日历部分从1号到30号垂直排列。我认为这是不对的。因为日历应该是一种数据形式，所以还是应该以表格的形式进行布局。取消css后，应该还是7行分组成一个table。th是另一个会被忽略的标签。由于CSS的万能性，所有的表格单元都可以用td加一个class属性来搞定。但从语义上讲，一些表格单元格应该用th标记。比如上面提到的日历表中，标识星期的单位中的“MONTUEWED...SUN”应该使用th而不是td。h1-h6对于h1-h6标签，从语义上讲，它们应该适用于所有标题文本。所以，有些写法如，然后直接为h1定义css，而不是.diary-title，不是一样的效果吗？当然，这个规则我不能太固定，因为有时候title部分的结构元素不是简单的用一个h1就能解决的。但是我用了类似
顶多是做标题结构的嵌套比较复杂，满足表现的需要，但是这里会有语义上的区别，h1应该理解为一级标题，还是理解为一个标题withfontsize1，我一般理解为一级标题，如果一级标题下有副标题，就用h2。但其实回头看HTML设计之初，h1-h6之后的数字更理解为控制标题文字的大小，可能用h3只是用三号字体，并不是三级标题，否则一级标题都用h1，都大字符，还得用css来控制字体大小，感觉很繁琐。因此，这是一个需要讨论的问题。ulol任何需要列出术语的人都应该使用ul或ol而不是p。比如招聘广告中的职位要求，比如注意事项，比如操作步骤说明。另一种流行的用法是网页的导航菜单也使用ulli来枚举，然后使用CSS来控制其排列。需要补充的是，不要忘记在li中可以使用ul或ol来构成二级列表。dldtdd这是一组几乎被遗忘的标签，但JeffreyZeldman在《网站重构》中极力主张使用它们。dl应该是“定义列表（或定义列表？知道的请告诉我）”的全称。典型的用法是字典条目。词名放在dt中，词的解释放在dd中。alistapart.com网站就更巧妙了，把整个右边的栏目定义为dl，每个单元的标题定义为dt，单元的内容定义为dd。一定要记住每个标签所表示的意思，也就是英文的本义是什么？比如dl是definitionlist，定义列表；dt为定义标题，定义标题；dd是definitiondescription，definitiondescriptionimgimg标签本身没什么好说的。我只想说一个老生常谈，就是当元素确实是内容中必须的图片时才使用img，否则应该用CSS定义为样式。比如插画，头像，表情，这些都是内容中必须出现的图片，用img。其他的，比如标题的背景图，列表项前面的小图标，都不应该使用img标签。spanspan现在与div相当。但其实我觉得还是应该沿用它原来的用法。在我个人的理解中，span最初是用来承载class或者style属性的。它本身没有明确的语义。所以在文本流中，我们需要改变一些文本的样式，所以我们使用span来围起来。比如有些词需要加红色，我就用
标签中定义了onclick。个人觉得应该在img外面加一个a，然后在a里面定义onclick，记得在js函数最后写returnfalse。如果可能的话，a标签的href属性也应该写上弹窗的URL，以保证在禁止JS的情况下，用户仍然可以有效打开页面。这就是我现在列出的所有内容。最后，总结一下遵循HTML标签语义的重要性。Web标准的要求之一是配置兼容性低：当用户禁用图片、禁用CSS或禁用JS时，我们仍然可以让他有效地浏览网页内容。众所周知，强制alt属性是为了考虑禁用图片时的兼容性。正确遵循HTML标签的语义是为了确保禁用CSS时的兼容性。只有正确使用HTML标签，当我们的网页“CSS裸奔”时，人们仍然可以看到导航菜单在哪里，文章标题在哪里，日历表也不会散架。内联元素和块级元素的具体区别是什么？行内元素的padding和margin可以设置吗？CSS规范规定每个元素都有一个display属性来确定元素的类型，每个元素都有一个默认的display值。例如，一个div的默认显示值为“block”，它是一个“块级”元素；一个span的默认显示属性值为“inline”，这是一个“内联”元素。(1)行内元素包括：abspanimginputselectstrong(强调语气)(2)块级元素包括：divulollidldtddh1-h6p(3)普通空元素：
鲜为人知：
