Python 44 前端概述三剑客常用标签与分类

Posted 2021-01-07 温暖你的心

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Python 44 前端概述三剑客常用标签与分类相关的知识，希望对你有一定的参考价值。

一：前端概述

　　前端指的就是页面的设计和给用户带来极高的用户体验

　　前端开发技术栈分为三大类：HTML 、CSS 、JavaScript

　　　　HTML(Hyper Text Markup Language)：

　　　　　　1 超文本标记语言

　　　　　　2 负责完成页面的结构

　　　　　　3 文件后缀：start.html

　　　　　　　　v_hint：标注，一些要注意的点(“超文本”就是指页面内可以包含图片，连接，音乐，程序等非文字元素)

　　　　CSS(Cascading Style Sheet)：

　　　　　　1 级联样式表

　　　　　　2 负责页面的风格设计，样式和美观

　　　　　　3 文件后缀：style.css

　　　　JS(JavaScript)：

　　　　　　1 浏览器脚本语言，可以编写运行在浏览器上的程序（脚本：比如游戏里面的角色，人物装备等等，这些就相当于脚本；再比如说，就是自己写的一个代码块，用相同他语言或不同他语言嵌套到别人的程序里面，我们也称之为脚本）

　　　　　　2 负责编写页面特效、调用浏览器的API(BOM) 、操作改变页面内容(DOM)，从后端获取数据(Ajax)，渲染页面等

　　　　　　3 文件后缀：cascade.js

二：前端三剑客

　　HTML ：

　　　1 标记语言：标记语言为非编程语言，不具备编程语言具备的程序逻辑

　　　2 HTML为前端页面的主体，由标签、指令与转义字符（实体）等组成（v_hint：转义字符）

标签：被尖括号包裹，由字?母开头包含合法字符的，可以被浏览器?解析的标记。eg:系统标签，?自定义
　　　　   标签
　　　　   指令：被尖括号包裹，由!开头的标记。eg:<!doctype html> 
　　　　   转义字符：被&与;包裹的特殊字?母组合或#开头的?十进制数。eg:< >

　　　3 HTML发展史代表版本

　　　4 文档类型

　 CSS ：

　　　1 标记语?言为?非编程语?言，不不具备编程语?言具备的程序逻辑

　　　2 css为前端?页?面的样式，由选择器?、作?用域与样式块组成

　　　　　选择器?：由标签、类、id单独或组合出现
　　　　作?用域：?一组?大括号包含的区域
　　　　样式块：满?足css连接语法的众多样式

　　　3 css发展史代表版本

　JavaScript：

　　　1 实实在在的编程语?言，完善的语法，可以完成复杂的程序逻辑

　　　2 js为前端?页?面的脚步，由DOM、BOM与ES组成

　　　　DOM：?文档对象模型(Document Object Model)，是W3C组织推荐的处理理可扩展标志语?言的标准编程接口。
　　　　BOM：浏览器?对象模型(Browser Object Model)，是?用于描述这种对象与对象之间层次关系的模型，浏览器?对象模型提供了了独?立于内容的、可以与浏览器?窗?口进?行行互动的对象结构。BOM由多个对象组成，
　　　　其中代表浏览器?窗?口的Window对象是BOM的顶层对象，其他对象都是该对象的?子对象。
　　　　ES：ES是?一种开放的、国际上?广为接受的脚本语?言规范(ECMAScript)，正式名称为 ECMA 262 和
　　　　ISO/IEC 16262，是宿主环境中脚本语?言的国际 Web 标准。

　　3 JS发展史

　　 4 JS框架：Angular、React与Vue等均是JavaScript主流框架

三：常用标签

　　1 无语义标签

　　2 常?用语义标签

　　　　<hn></hn> 标题
　　　　 <p></p> 段落
　　　　 <pre></pre> 原?文本
　　　　 <br /> 换?行行
　　　　 <hr /> 分割线

　　3 ?文本标签

　　　　 <i></i> 斜体字
　　　　   <em></em> 斜体字，表示强调
　　　　   <b></b> 粗体字
　　　　   <strong></strong> 粗体字，表示强调(语?气更更强)
　　　　   <del></del> 删除的?文本
　　　　   <ins></ins> 插?入的?文本
　　　　   <sub></sub> 下标字
　　　　   <sup></sup> 上标字
　　　　   <ruby>
　　　　   拼?音<rt>pinyin</rt>
　　　　 </ruby> 中?文注?音，h5新增

　　4 其他标签

　　　　 <section></section> 块
　　　　 <small></small> ?小号字体

四：标签分类

　　1 单 | 双标签

　　　　单标签：单标签在?自身标签标识结束，主要应?用场景为功能性标签

　　　双标签：双标签有成对的结束标识，主要应?用场景为内容性标签

　　2 ?行行 | 块标签

　　　　行标签：又名内联标签，内联标签自身不具备宽高，通常同行显示

　　　　块标签：又名块级标签，块标签拥有自身宽高，通常独自占据一行

　　3 单一 | 组合标签

　　　　单一标签：单独出现，表示具体的功能或展示具体的内容

　　　　组合标签：配合使用，才能产生相应的内容与效果