当前主流HTML5的网页是否依然是以DIV + CSS为基础开发的？
程序员文章站
2022-05-17 14:25:06
...
我是web前端的初学者，希望能够在学习中跟上主流，目前对于HTML和CSS都学习了语法，但考虑到在实际开发一个网站是如何通过这两者来进行的，有些不知所措。在网上搜了下大概都是讲通过DIV + CSS来布局网页的，但这个作为以往网页的开发手段，和现在表现内容更加生动丰富的HTML5网站，这个方法是否依然是主要的。
你先换个搜索引擎再说。 首先 直接回答题主的问题
”当前主流HTML5的网页是否依然是以DIV + CSS为基础开发的？“
这句话本身
大体上是正确的 但是又不够严谨
我们现在通过浏览器打开所看到的页面
基本组成元素我们称之为HTML，也就是网站的结构层，而div只是HTML的一个比较重要的元素而已
我们把一个站点比喻成一个人体吧
那HTML就好比人体的骨架
而CSS呢
就相当于人类的皮肤等 起到一个渲染装饰的作用 负责修饰人的外观
比如控制你这个人是高鼻子还是塌鼻子
双眼皮还是单眼皮 A cup还是E cup （害羞）
最后还有一个建设网站非常重要的语言是javascript
它是让网站”动起来“必要的组成部分
它的作用是相当于控制人类微笑、拥抱、接吻以及pia pia pia等行为的咯~~（捂脸）
虽然大家都是用的都是HTML+CSS+javascript来实现网站的前端部分
但是我们可以用语义化标签来实现更好的SEO
可以用弹性布局、响应式布局来实现不同屏幕分辨率给用户展示更加友好的体验效果
可以用requirejs、seajs来自动处理javascript模块的加载依赖
可以用less、sass来提高css的写作效率
可以用gulp+nodejs实现项目的构建、测试、打包部署等工作
同样是汉字
有的人只能拿来应付考试 写篇水水的作文 比如说答主自己
有的人却能写出来精彩纷呈小说 比如说天龙八部、鹿鼎记、神雕侠侣 比如说金庸老前辈
同样是HTML+CSS+javascript
有的人只是用它们来做了一个只有几个页面的普通企业站 装饰门面
有的人拿它们来做了一个叫做阿里巴巴的平台 小伙伴们双十一双十二在上面刷得不亦乐乎
我觉得题主是想做后者吧
那么咱一起努力咯
最最后 欢迎加入我们的萌萌哒前端人3 前面都满人了 囧 群号555360861大家一起交流吧^_^ 我素质低，看到 div + css 我就想骂人。能不能把这个职业说得高大上点？ 虽然大家都是这么用的，但是你出去千万不要这么说哦，至少几个词要随口能说出来，例如 语义化标签，弹性布局，响应式布局，模块化，原子化，less,sass,组件化开发。
恩，然后回家后继续用div+css开发就行了。 这么理解吧，传统的web架构
css为皮肤，div则为真皮，js组成简单的肌肉和血管，后端各种p才是大脑
html5时代，css和div依然是皮肤和真皮，但是皮肤比以前绚丽多彩了，也可以对外界交互产生简单的应激反应。。。
js可以组成更复杂肌肉，能做的动作也会增多，而且更加规范
肌肉与大脑的联动性也增加不少
从全靠大脑的时代，变成皮肤肌肉大脑协同的时代的。。。呵呵 HTML5定义：能向后兼容目前UA处理内容的方式。为了让语言更简单，一些老的元素和Attribute会被舍弃。比如一些纯粹用于展现的元素（如big）或Attribute被舍弃，因为他们更适合用CSS来处理。
但UA依然可以支持老旧的属性和元素。这就是为什么HTML5标准清楚地划分了给开发的要求和给UA的要求。比如，开发者不应当使用plaintext元素，但UA需要兼容plaintext元素。
既然HTML5已区分对UA和对开发者的要求，再也不需将一些特性标记为deprecated了。
举个例子：
div+css一定会学习块状元素和行内元素，但这两个HTML元素概念从字面上却和CSS样式有着很深的联系，这种联系有悖于Web规范中一直倡导的表现和样式分离这种核心理念。
HTML5新规范中，已经淡化了元素的这两种分类，取而代之的方案是更具有语义的HTML元素分类方式，如下：
回复内容：
“在网上搜了下大概都是讲通过DIV + CSS来布局网页的……”你先换个搜索引擎再说。 首先 直接回答题主的问题
”当前主流HTML5的网页是否依然是以DIV + CSS为基础开发的？“
这句话本身
大体上是正确的 但是又不够严谨
我们现在通过浏览器打开所看到的页面
基本组成元素我们称之为HTML，也就是网站的结构层，而div只是HTML的一个比较重要的元素而已
我们把一个站点比喻成一个人体吧
那HTML就好比人体的骨架
而CSS呢
就相当于人类的皮肤等 起到一个渲染装饰的作用 负责修饰人的外观
比如控制你这个人是高鼻子还是塌鼻子
双眼皮还是单眼皮 A cup还是E cup （害羞）
最后还有一个建设网站非常重要的语言是javascript
它是让网站”动起来“必要的组成部分
它的作用是相当于控制人类微笑、拥抱、接吻以及pia pia pia等行为的咯~~（捂脸）
虽然大家都是用的都是HTML+CSS+javascript来实现网站的前端部分
但是我们可以用语义化标签来实现更好的SEO
可以用弹性布局、响应式布局来实现不同屏幕分辨率给用户展示更加友好的体验效果
可以用requirejs、seajs来自动处理javascript模块的加载依赖
可以用less、sass来提高css的写作效率
可以用gulp+nodejs实现项目的构建、测试、打包部署等工作
同样是汉字
有的人只能拿来应付考试 写篇水水的作文 比如说答主自己
有的人却能写出来精彩纷呈小说 比如说天龙八部、鹿鼎记、神雕侠侣 比如说金庸老前辈
同样是HTML+CSS+javascript
有的人只是用它们来做了一个只有几个页面的普通企业站 装饰门面
有的人拿它们来做了一个叫做阿里巴巴的平台 小伙伴们双十一双十二在上面刷得不亦乐乎
我觉得题主是想做后者吧
那么咱一起努力咯
最最后 欢迎加入我们的萌萌哒前端人3 前面都满人了 囧 群号555360861大家一起交流吧^_^ 我素质低，看到 div + css 我就想骂人。能不能把这个职业说得高大上点？ 虽然大家都是这么用的，但是你出去千万不要这么说哦，至少几个词要随口能说出来，例如 语义化标签，弹性布局，响应式布局，模块化，原子化，less,sass,组件化开发。
恩，然后回家后继续用div+css开发就行了。 这么理解吧，传统的web架构
css为皮肤，div则为真皮，js组成简单的肌肉和血管，后端各种p才是大脑
html5时代，css和div依然是皮肤和真皮，但是皮肤比以前绚丽多彩了，也可以对外界交互产生简单的应激反应。。。
js可以组成更复杂肌肉，能做的动作也会增多，而且更加规范
肌肉与大脑的联动性也增加不少
从全靠大脑的时代，变成皮肤肌肉大脑协同的时代的。。。呵呵 HTML5定义：能向后兼容目前UA处理内容的方式。为了让语言更简单，一些老的元素和Attribute会被舍弃。比如一些纯粹用于展现的元素（如big）或Attribute被舍弃，因为他们更适合用CSS来处理。
但UA依然可以支持老旧的属性和元素。这就是为什么HTML5标准清楚地划分了给开发的要求和给UA的要求。比如，开发者不应当使用plaintext元素，但UA需要兼容plaintext元素。
既然HTML5已区分对UA和对开发者的要求，再也不需将一些特性标记为deprecated了。
举个例子：
div+css一定会学习块状元素和行内元素，但这两个HTML元素概念从字面上却和CSS样式有着很深的联系，这种联系有悖于Web规范中一直倡导的表现和样式分离这种核心理念。
HTML5新规范中，已经淡化了元素的这两种分类，取而代之的方案是更具有语义的HTML元素分类方式，如下：
- 元数据式内容（Metadata content）：
、 、、... - 流式内容（Flow content）：、...[注：1]
- 章节式内容：
、 - 标题式内容：
~
、
- 段落式内容：、
...[注：2]
- 嵌入式内容：
- 交互式内容：、
结论：前端开发者在HTML5的开发中还继续使用css进行布局，但是更应该结合实际的页面的设计有意识的使用HTML5规范中的内容模型，并通过这些更具有语义的内容模型进行页面的normal flow设计。
详细的内容请看这里HTML5 Differences from HTML4
另外w3c上这篇文章也很好《HTML5 Differences from HTML4》 连接-->HTML5 Differences from HTML4
注1：这个分类基本包括了HTML4.01中的块状元素和行内元素。
注2：基本上等同于HTML4.01中行内元素的范围。 书名有“DIV+CSS”的一律不要买、不要看！ DIV+CSS 这个说法是外行话，有类似字眼的教程、书不要看不要买，有这样说法的面试官的公司不要去。 是，但不仅限于。
前端（HTML5）技术栈 = HTML（包括新的HTML5标签） + CSS（包括CSS3） + DOM + Javascript APIs (Web Workers/Web Socket/Video/Canvas..) 不是哦。。是基于HTML5+CSS+Javascript开发的。。。声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn核实处理。
相关文章
相关视频
- 章节式内容：