【黑马前端】基础班总结

HTML

1、定义：超文本标记语言（hyper text markup language）

​ 　　 超：可以加图片、声音、动画、多媒体等非文本内容；

​ 　　　　 可以从一个文件跳到另一个文件，即超级链接文本。

2、运行方式：前端人员开发代码 ----> 浏览器显示代码（解析、渲染） -----> 生成最后的 Web 页面

3、浏览器内核：浏览器内核即负责解析渲染前端人员开发代码的渲染引擎，负责读取网页内容，整理讯息，计算网页的显示方式并显示页面。 

目前国内一般浏览器都会采用 Webkit/Blink 内核，如 360、UC、QQ、搜狗等。

4、WEB标准

　　Web 标准是由 W3C 组织和其他标准化组织制定的一系列标准的集合。

　　WEB标准构成：

　　　　　a.结构：HTML

　　　　　b.表现：外观样式，CSS

　　　　　c.行为：网页模型定义及交互编写,JavaScript 

5、标签

 

 　　常用标签：

　　　　　　<h1>-<h6> 标题标签   独占一行

　　　　　　<p> 段落标签    独占一行，有段间距  <p>内不能放块级元素（文字类元素内不能放块级元素）

　　　　　　<div> 独占一行的盒子  以上都为块级元素，宽度默认为父级宽度

　　　　　　<span>  行内块小盒子  行内元素 无法设置宽高

　　　　　　<img> <input> <td> 行内块元素，一行可放多个，中间有空隙   默认宽度为内容宽度   宽高等可设置。

　　　　　　超链接标签   <a href="跳转目标" target="目标窗口弹出方式"> 文本或图像 </a>

　　　　　　　　href 指定链接目标地址    外部链接，href="外部网址"  内部链接=”自定义.html“  空连接=”#“  锚点链接

　　　　       表格标签 表格用来显示、展示数据

　　　　　　　　表格<table> 行<tr> 单元格<td> 表头<th>

　　　　　　　　合并单元格 ： 跨行合并 rowspan；跨列合并 colspan。（多余单元格要注释掉）

　　　　　列表标签：列表是用来布局的

　　　　　　　 　无序列表：无序列表的各个列表项之间没有顺序级别之分，是并列的。

　　　　　　　　有序列表：为有排列顺序的列表，其各个列表项会按照一定的顺序排列定义。

　　　　　　　　自定义列表：常用于对术语或名词进行解释和描述，定义列表的列表项前没有任何项目符号。

　　　　　表单标签：与用户交互，收集用户信息

　　　　　　　　表单域：在 HTML 标签中，<form>标签用于定义表单域，以实现用户信息的收集和传递。

　　　　　　　　表单控件：input select textarea   <lable>标签用于绑定一个表单元素, 当点击<lable>标签内的文本时，浏览器就会自动将焦点(光标)转到或者选择对应的表单元素上,　　 　　　　　　　　 　　　　　　　　　　　　　　　　　　　　　　　用来增加用户体验。<lable>标签的 for 属性应当与相关元素的 id 属性相同。

　　　　　　　　提示信息：文本内容

CSS

　　1、简介：层叠样式表。CSS 主要用于设置 HTML 页面中的文本内容（字体、大小、对齐方式等）、图片的外形（宽高、边框样式、 边距等）以及版面的布局和外观显示样式。

　　2、代码规范：选择器后、大括号前加一个空格；属性冒号后，属性值前，加空格。

　　3、CSS引入方式

　　　　　　行内样式表    内部样式表    外部样式表

　　4、选择器

　　　　　　后代选择器 标签之间用空格隔开

　　　　　　子代选择器 大于号隔开，只选亲儿子

　　　　　　并集选择器 集体声明，用逗号隔开

　　　　　　伪类选择器

　　　　　　　　链接伪类 LAHA link visited hover active

　　5、三大特性

　　　　　　层叠性

　　　　　　继承性

　　　　　　优先级 继承或* 0000    元素选择器 0001    类或伪类 0010    ID选择器 0100    行内样式 1000     important 无穷大

　　6、盒子模型   内容+内边距+边框   外边距（相遇会合并）

　　7、浮动  浮动元素脱离标准流  一行显示且顶部对齐 默认宽度由内容撑开

　　8、定位  定位模式+边偏移

　　　　　　相对定位  相对于自己原来的位置 原位置在标准流中继续占有

　　　　　　绝对定位  相对于有定位的祖先元素   不占原来的位置

　　　　　　固定定位  相对于可视窗口

　　　　　　粘性定位  相对于可视窗口 占有原先位置  必须写一个方位属性