我的编程空间,编程开发者的网络收藏夹
学习永远不晚

web前端只是表示层吗

短信预约 -IT技能 免费直播动态提醒
省份

北京

  • 北京
  • 上海
  • 天津
  • 重庆
  • 河北
  • 山东
  • 辽宁
  • 黑龙江
  • 吉林
  • 甘肃
  • 青海
  • 河南
  • 江苏
  • 湖北
  • 湖南
  • 江西
  • 浙江
  • 广东
  • 云南
  • 福建
  • 海南
  • 山西
  • 四川
  • 陕西
  • 贵州
  • 安徽
  • 广西
  • 内蒙
  • 西藏
  • 新疆
  • 宁夏
  • 兵团
手机号立即预约

请填写图片验证码后获取短信验证码

看不清楚,换张图片

免费获取短信验证码

web前端只是表示层吗

web前端只是表示层吗

本教程操作环境:windows7系统、Dell G3电脑。

W3C是指万维网联盟(World Wide Web Consortium),创建于1994年10月。W3C的出现是为了定制网页开发的标准,让使用相同的网页能在不同的浏览器中有相同的效果,所以我们定制编写的网页都需要遵循W3C的规范。

Web前端开发思路是把网页分成三个层次,即:结构层、表示(样式)层、行为层。

HTML:结构层

网页的结构或内容层是该页面的基础HTML代码。正如房屋的框架为房屋的其他部分构建了一个坚实的基础,HTML的坚实基础创建了一个可以在其上创建网站的平台。

结构层用于存储客户想要阅读或查看的所有内容。HTML结构可以包含文本和图像,它包括访问者用于浏览网站的超链接。这是在符合标准的HTML5中编码的,可以包括文本,图像和多媒体(视频,音频等)。

CSS:样式层

该层指示结构化HTML文档如何看待网站的访问者,并由CSS(层叠样式表)定义。这些文件包含有关如何在Web浏览器中显示文档的样式说明。样式层通常包括基于屏幕大小和设备更改站点显示的媒体查询。

网站的所有视觉样式都应位于外部样式表中。您可以使用多个样式表,但请记住,每个CSS文件都需要HTTP请求才能获取它,从而影响站点性能。

JavaScript:行为层

行为层使网站具有交互性,允许页面响应用户操作或基于一组条件进行更改。JavaScript是行为层最常用的语言,但CGI和PHP也经常被使用。

当开发人员引用行为层时,大多数都是指在Web浏览器中直接激活的层。您可以使用此图层直接与DOM(文档对象模型)进行交互。在内容层中编写有效的HTML对于行为层中的DOM交互非常重要。在构建行为层时,应该像使用CSS一样使用外部脚本文件来优化速度和性能。

简单来说,JavaScript 与 HTML 和 CSS 共同构成了我们所看到的网页

  • HTML 用来定义网页的内容,例如标题、正文、图像等;

  • CSS 用来控制网页的外观,例如颜色、字体、背景等;

  • JavaScript 用来实时更新网页中的内容,例如从服务器获取数据并更新到网页中,修改某些标签的样式或其中的内容等,可以让网页更加生动。

HTML是超文本标记语言(HyperText Markup Language)是一种用于创建网页的标准标记语言。HTML负责网页三个组成部分中的结构,HTML使用标签的形式来标识网页中的不同组成部分。所谓的超文本指的是超链接,使用超链接可以让我们从一个页面跳转到另一个页面。

CSS 是指层叠样式表 (Cascading Style Sheets),样式定义如何显示HTML 元素,用于控制web页面的外观。CSS负责网页三个组成部分中的表现,样式通常保存在外部的 .css 文件中。我们只需要编辑一个简单的 CSS 文档就可以改变所有页面的布局和外观。

JavaScript 是脚本语言(简称"JS"),是一种轻量级的编程语言,用于控制网页的行为。JavaScript负责网页三个组成部分中的行为,可插入 HTML 页面的编程代码,JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。

扩展知识:分层的好处

1、共享资源:

当您编写外部CSS或JavaScript文件时,站点上的任何页面都可以使用该文件。如果您需要对该文件进行更改,也许更新网站上的某些排版样式,则使用该样式表的每个页面都会得到更改。没有必要单独编辑网站的每个页面,这对于大型网站来说可能是一项艰苦的任务。

2、下载速度更快:

首次由客户下载脚本或样式表后,Web浏览器会对其进行缓存。由于这些共享资源现在包含在浏览器的缓存中,因此浏览器中请求的其他页面加载速度更快,从而提高了整体页面速度和性能。

3、多人团队:

如果您有多个人同时在网站上工作,您可以使用允许文件签入和签出的系统,以确保每个人都使用最新版本。如果样式和行为与结构文档交织在一起,那就更难了。

4、搜索引擎优化:

一个明确分离风格和结构的网站可能会对搜索引擎有更好的表现,因为它们可以更有效地抓取内容并理解页面而不会陷入视觉风格和行为信息。

5、辅助功能:

外部样式表和脚本文件更易于人们和浏览器访问。屏幕阅读器等软件可以更轻松地处理结构层中的内容,而无需处理无论如何都无法使用的样式。

6、向后兼容性:

使用单独的开发层设计的站点更可能向后兼容,因为无法使用某些CSS样式或禁用了JavaScript的浏览器和设备仍然可以查看HTML。然后,您可以使用支持它们的浏览器的功能逐步增强您的网站。

(学习视频分享:web前端入门)

以上就是web前端只是表示层吗的详细内容,更多请关注编程网其它相关文章!

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

web前端只是表示层吗

下载Word文档到电脑,方便收藏和打印~

下载Word文档

猜你喜欢

web前端只是表示层吗

不是。web前端可分为三层:1、结构层,由HTML或XHTML之类的标记语言负责创建,用于存储客户想要阅读或查看的所有内容,可以包含文本、图像、超链接和多媒体。2、表示层,由CSS负责创建,包含有关如何在Web浏览器中显示网页文档的样式说明。3、行为层,是网页的行为,由JS语言创建,可实时更新网页中的内容,使网站具有交互性,允许页面响应用户操作或基于一组条件进行更改。
2023-05-14

web前端:什么是web前端?Web前端好入门吗?

编程学习网:前端技术一般分为前端设计和前端开发,前端设计一般可以理解为网站的视觉设计,前端开发则是网站的前台代码实现,包括基本的HTML和CSS以及Javascript/ajax,现在最新的高级版本HTML5、CSS3,以及SVG等。
web前端:什么是web前端?Web前端好入门吗?
2024-04-23

web前端三层结构是什么

本篇内容介绍了“web前端三层结构是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!web前端的三层结构分别是:1、结构层,由HTML或X
2023-07-05

web前端中表单的作用是什么

这篇文章主要讲解了“web前端中表单的作用是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“web前端中表单的作用是什么”吧!表单的作用有两个:1、对于用户而言是数据录入和提交的界面;2、
2023-07-05

好程序员web前端分享CSS3颜色值HSLA表示方式

说明:本文档兼容性测试基础环境为:windows系统;IE6-IE10, Firefox6.0, Chrome13.0, Safari5.1, Opera11.51说明:HSLA(H,S,L,A)取值:H:Hue(色调)。0(或360)表示
2023-06-03

web前端:Layui提交表单时验证必选的多选框是否有选中

编程学习网:事实上,layui更多是面向于后端开发者,所以在组织形式上毅然采用了几年前的以浏览器为宿主的类AMD模块管理方式,却又并非受限于CommonJS的那些条条框框,它拥有自己的模式,更加轻量和简单。layui定义为经典模块化,并非是刻意强调模块理念本身,而是有意避开当下JS社区的主流方案,试图以尽可能简单的方式去诠释高效!它的所谓经典,是在于对返璞归真的执念,它以当前浏览器普通认可的方式去组织模块!
web前端:Layui提交表单时验证必选的多选框是否有选中
2024-04-23

6年全栈工程师回答:web前端的主要学习什么,现在还有前途吗?一般工资是多少?

首选我不明白你为啥没有对前端工程师这个行业在有一定了解之后再展开学习,下面备注是说正在学习这个,我就一脸问号了(?????) 可能你还是大学生吧,对于工资多少,不同地区,一线二线,三线四线城市都是有差异的,你可以通过招聘网站去看,眼见为实嘛
2023-06-03

编程热搜

目录