零基础教你学前端——什么是网页?
现在开始,我们要正式进入大前端的技能学习了。
先来认识什么是网页?
不管你是不是小白,是否了解前端,在日常生活中,这些东西你一定经常接触,比如网站,手机APP,微信小程序,智能电视,数据可视化大屏,地图应用,网页游戏。
这些我们看到的界面,其实全部都是网页,我们也会发现一个特点:我们所看到的所有网页,他们都有一个共同的载体,这个载体就是我们的浏览器,没有浏览器,我们的网页就不能执行,这就好像我们平时使用的APP一样,他们要依赖于我们的手机操作系统,如果没有手机操作系统,这些APP软件就不能执行,他们的存在就没有任何价值了,那浏览器如何获取这些网页呢?
浏览器如何获取这些网页?
以电脑浏览器为例,当你在浏览器中输入千锋教育网址,浏览器使用这个网址,通过互联网去向千锋服务器发起请求,服务器得到请求之后,再通过互联网会向浏览器中返回一个文件,这个文件在浏览器中运行,它就生成了一个网页。
网页的的组成主要就是三个部分内容,分别是:HTML、CSS和JavaScript。
什么是HTML呢?
它决定了网页里显示什么内容,比如在网页中显示一个按钮;什么又是CSS呢?它可以修饰每一个内容的外观,包括大小、颜色、位置等内容,比如CSS可以把按钮变成带有圆角并且红色背景的样式。
什么是JavaScript呢?
它主要是负责网页中一些动态的效果,例如:当你点击这个按钮的时候,就会播放一段视频。接下来用一个案例来验证一下HTML,CSS,JavaScript的作用。
现在我们看到的是这个网页的效果:有内容、有样式、并且可以交互接下来,我们把HTML的内容删除掉,会看到浏览器中什么内容都没有了。
然后,我们保留HTML,同时把CSS去掉,我们发现,网站变得丑陋了。只有HTML的文本文字链接和图片了,显的杂乱无章。
最后,我们把JavaScript去掉,只保留HTML和CSS,看起来页面好像没有什么变化,还是老样子,但是我们在使用搜索引擎的时候,原有的交互效果都已经不见了。
现在,你理解HTML\CSS\JAVASCIPT的作用了吗?构成网页的这三个部门相辅相成缺一不可。接下来我们从HTML开始学习如何制作网页了,网页技术的发展始终离不开HTML从1993年HTML的诞生到2014年HTML5的问世。短短的十几年时间技术,由原来的只关注电脑端页面技术发展慢慢涉及移动设备领域。对于它和CSS的结合再也不容忽视,时至今日HTML5已经给我们带来了前所未有的产品体验。
HTML的探索旅程即将开始准备和我一起扬帆启航!
相关推荐HOT
9个JSON.stringify的秘密大多数开发人员却不知道
stringify() 可以返回 undefined。Date实例通过返回字符串实现toJSON()函数(同date.因此,它们被视为字符串。所有其他对象实例(包括 Map、Set、...详情>>
2023-01-31 17:45:00为什么“false == []”和“false == ![]”都返回true?
JavaScript 是一种非常优秀的编程语言,但与此同时,它也常常让我感到困惑。 可能我还不够了解!有时我真的想不通它是如何工作的,看完这5个奇...详情>>
2022-12-29 11:25:00零基础教你学前端——初识图片标签
今天继续学:图片——网页中重要的一员。一个成熟的网站,除了有文本内容,还会有大量的图片展示,好让我们的网站变得丰富多彩。例如千锋教育官...详情>>
2022-11-07 11:17:50零基础教你学前端——标题和段落标签
这节课学习页面中的标题和段落标签。为了丰富页面中的内容,需要用到各种各样不同的标签这里面出现了三个不同的标题类型,他们的大小和加粗情况...详情>>
2022-11-07 11:07:00热门推荐
js获取class属性的值
沸什么是事件委托?javascript事件委托的实现原理
热css绝对定位和相对定位
热9个JSON.stringify的秘密大多数开发人员却不知道
新TypeScript中必须知道的6个泛型方法
如何在JavaScript中将十进制转换为十六进制
如何在JavaScript中将数字四舍五入到小数点后两位
为什么“false == []”和“false == ![]”都返回true?
说说Vuex原理
vuex怎么拿数据
零基础教你学前端——超链接之页面跳转
零基础教你学前端——图片标签拓展
零基础教你学前端——图片标签进阶
零基础教你学前端——初识图片标签