html/css的总结

第一、

div、table、ul是HTML中的标签，通常情况下，每个标签都是有语义的，用于描述内容展示信息的，就像我们的衣服分为外套、裤子、裙子、内裤、棉袄等，每一种衣服有各自的功能，它们各司其职，各展其能，排列组合成各式各样的造型。当然，每个人都有属于自己的穿衣风格，故每个人都有自己写前端页面的风格。

第二、

• div在HTML中是无语义的标签；（为什么说是无语义的呢？浏览器解析HTML的时候默认div为display：block（默认换行），才有了宽高，其实可以设置为inline或none的，故它是无语义的；还有一个span也是无语义的，默认为display:inline的，且默认不换行）
• table的语义是一个数据表，比如一个课程表；
• ul的语义是无序列表，比如这里三种标签的介绍。

第三、Html是表意的而非表象的

1、html是表意的而非表象的；

2、块级元素或者行内行内是css内的概念，div默认是display:block，而span默认是display:inline；

3、HTML的设计是语义化的，就是当你的页面撤掉全部的css，仍能清晰地展示页面的结构和层次；

4、css是一种增强页面内容表现的语言。用于颜色、尺寸的设置，用于增强人与页面系统的交互（hover、active、visited），也用于破坏格局（display、position、float）；

5、table 不要用来做界面布局，只建议放表格类的数据，像 Excel 一样。表单还是建议用 form>label>input 来写，然后辅以 CSS 进行布局。

可以参考 Bootstrap 的实现：CSS · Bootstrap 它表单可以横排/竖排，而不用改变 HTML 的结构。但 table 做布局是非常不灵活的，从一种布局方式改变到另外一种，就需要大动 HTML 的结构。

6、ul在导航栏等地的使用也非常广泛——因为它们就是个无序列表。

7、div标签英文翻译为：division，意为专区、除法、师，可拓展为区块、块状、间隔的含义，它是无语义的，我觉得它的作用就是 对整个html页面（界面）进行分区，对其结构进行严谨的布局，标签一致，使得整个html页面更加规整、美观，易于他人（后来者）进行查看或者修改。

总结：学好基础，重视语义，重视CSS