摘要:基础基础是一种标记语言,不是编程语言,需要明确这点。元素标签内容基础基础负责文本样式的呈现,既然将和分离开,各自只负责各自的职责,那么肯定需要某种方式将两者连接在一起。
本篇文章已授权微信公众号 dasu_Android(大苏)独家发布
本系列文章内容全部梳理自以下四个来源:
作为一个前端小白,入门跟着这四个来源学习,感谢作者的分享,在其基础上,通过自己的理解,梳理出的知识点,或许有遗漏,或许有些理解是错误的,如有发现,欢迎指点下。
通俗的讲:Html 只负责文档的语义和结构,它描述了网页的内容和结构。
内容的呈现则由应用于元素上的 CSS 样式控制,它描述了网页的表现与展示效果。
JavaScript 则是负责网页的功能与行为,如与用户的交互。
Html 是一种标记语言,不是编程语言,需要明确这点。
编程语言,通俗的理解就是向计算机发送指令,通过程序让计算机达到我们想要的功能。
而标记语言,可以通俗的理解成对文本增加一些标志信息,类似于批注信息来说明文本内容
更通俗点理解,一大段文本内容,毫无重点,毫无结构,让人不好理解。所以,Html 就通过大伙约定俗成的规范,利用一些标签,来指明,这一段文本是标题,这一段文本是个表格,这一段文本是个列表,这一段文本是导航菜单,这里需要分段,这里需要分行,这几个词是关键词,需要重点标记一下,等等等等。
Html 可以这么通俗的理解。那么这个大伙约定俗成的规范,其实也就是由 W3C 来作为官方发布的标准规范。
定了规范,自然是想要让人遵守才有意义。所以,在这里,W3C 所定义的标准规范,遵守方其实也就是各大浏览器。不同的浏览器厂商,根据 W3C 发布的标准规范来解析每一份 HTML 文档,那么相同的 HTML 文档在不同的浏览器上才会有相同的作用。
而一旦某些浏览器厂商没有遵守这些规范,那么前端开发人员就要为此做一些兼容适配工作,这就跟 Android 系统由 Google 开发并开源一样的道理,手机厂商都可以使用这开源的系统,但不同厂商都喜欢做一些自己的修改,这就导致了 Android 开发人员经常需要面对的适配工作问题。
点击跳转
标签:<> 带有这种符号的称为标签,跟 Android 中的标签一样,分开始标签,结束标签
内容:文本内容,上图中的点击跳转四字
属性:跟 Android 中的 xml 里的标签一样,每个标签有自己的一些属性,另外,Html 有一些全局属性,比如上述的 class,这个属性所有标签都可以用。
元素:标签 + 内容
CSS 负责文本样式的呈现,既然将 HTML 和 CSS 分离开,各自只负责各自的职责,那么肯定需要某种方式将两者连接在一起。
更准确的说,是在 HTML 文档中该如何使用 CSS,因为 HTML 文档是互联网的基础,一个个网页就是一份份HTML 文档,既然 HTML 文档是基础,那么就是要明确在 HTML 文档中该如何使用 CSS。
总共有三种方式:全局属性 style,style 标签,link 标签
CSS 最终作用的对象其实就是 HTML 文档中的每个元素
第一种方式:全局属性 style 是直接作用于指定的标签上了,用法就直接将需要的样式声明即可,如:
点击跳转
style 是所有标签都具有的属性,称之为全局属性。
剩余两种方式,都是集中将所有的 CSS 样式管理存放,因此如果需要作用到具体元素上,要借助选择器来实现,选择器后面再说,先看这两种方式的使用:
style 标签和 link 标签都是 HTML 文档中的一种标签,两者都可以用来连接 css 代码,区别一种是将 css 代码内嵌在 HTML 文档中,一种是直接引用外部 css 文件。
但这两种相比较于第一种使用全局属性的方式,它们并没有直接在相关联的元素上书写,因此需要有一种机制,来将这些 css 代码关联到需要作用的元素对象上,这个机制就叫:选择器。
选择器是专门用来将 css 代码关联到指定的 HTML 文档中的元素对象上的,毕竟 css 已经被抽离出 HTML,各自负责各自的职责,但总归需要一种桥梁将两者关联在一起。
选择器很多,规则也很多,足够覆盖各种各样的场景,这里只列举几种常见的选择器:
点击跳转
另一文本
效果:作用于 HTML 文档中的所有 a 标签的元素上
点击跳转
id 在 HTML 文档中需唯一存在,所有 id 选择器只作用于单个元素
点击跳转
另一文本
HTML 文档中可对多个元素应用相同 class,所以 class 可同时作用于多个元素
点击跳转
另一文本
作用于所有具有 href 属性的元素,不管有没有使用
点击跳转
另一文本
元素选择器和 class 选择器组合使用,作用于 a 元素中有声明 myClass 类型的元素
作用到所有元素上
Js 是脚本语言,可用于增加网页的交互功能,及各种行为功能。
既然是一门语言,那么学习这么脚本语言自然需要先掌握其语法,以及运行方式。
浏览器解析 HTML 文档是按顺序解析的,也就是说,当遇到脚本语言时,也会按顺序一条条的解释执行,直至将脚本语言执行结束再继续解析文档。这就解释了,为什么一份 HTML 文档里,
大家好,我是 dasu,欢迎关注我的公众号(dasuAndroidTv),如果你觉得本篇内容有帮助到你,可以转载但记得要关注,要标明原文哦,谢谢支持~
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/1633.html
摘要:个人前端文章整理从最开始萌生写文章的想法,到着手开始写,再到现在已经一年的时间了,由于工作比较忙,更新缓慢,后面还是会继更新,现将已经写好的文章整理一个目录,方便更多的小伙伴去学习。 showImg(https://segmentfault.com/img/remote/1460000017490740?w=1920&h=1080); 个人前端文章整理 从最开始萌生写文章的想法,到着手...
摘要:围绕以太坊的开发生态是目前相对最成熟的,比如有开发框架,有智能合约在线集成开发环境,还有专设的开发者问答频道。 showImg(https://segmentfault.com/img/bVbaJOL?w=1200&h=514); 张泉灵说,时代抛弃我们的时候连声再见都不会说,马云说对于新兴事物,绝大多数人是看不见、看不起、看不懂、来不及。自从学完 Coursera 上的 Crypto...
摘要:围绕以太坊的开发生态是目前相对最成熟的,比如有开发框架,有智能合约在线集成开发环境,还有专设的开发者问答频道。 showImg(https://segmentfault.com/img/bVbaJOL?w=1200&h=514); 张泉灵说,时代抛弃我们的时候连声再见都不会说,马云说对于新兴事物,绝大多数人是看不见、看不起、看不懂、来不及。自从学完 Coursera 上的 Crypto...
摘要:好程序员前端培训入门之基础知识梳理汇总,前端工程师是当前各大企业都比较稀缺的人才,薪资待遇和就业前景都很不错。作用域链的前端,始终是当前执行代码所在环境的变量对象。 好程序员Web前端培训入门之JS基础知识梳理汇总,Web前端工程师是当前各大企业都比较稀缺的人才,薪资待遇和就业前景都很不错。不论是专业还是非专业,有基础亦或是无基础,都想通过学习Web前端实现高薪就业。不过,学习要一...
阅读 1063·2021-11-16 11:42
阅读 2878·2021-10-12 10:18
阅读 2833·2021-09-24 09:48
阅读 3431·2019-08-30 15:56
阅读 1494·2019-08-30 14:17
阅读 3022·2019-08-29 12:14
阅读 881·2019-08-27 10:51
阅读 1996·2019-08-26 13:28