weixin_46623496的博客

CSS背景背景属性可以设置背景颜色、背景图片、背景平铺、背景图片位置、背景图像固定等1.背景图片background-image属性描述了元素的背景图像。实际开发常见于logo或者一些装饰性的小图片或者时超大的背景图片，优点是非常便于控制位置[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-3EWYnihF-1627359979654)(F:\learn_note\723CSS元素显示背景\image-20210723175640770.png)]2.背景平铺如果需要

1.CSS3 2D转换转换（transform）是CSS3中具有颠覆性的特征之一，可以实现元素的唯一、旋转、缩放等效果移动：translate旋转：rotate缩放：scale1.移动transform:translate(x,y); 或者分开写transform:translateX(n);transform:translateY(n);不会影响到其他元素的位置translate中的百分比单位是相对于自身元素的translate：（50%，50%）translate对于行内

1.HTML5新增语义化标签< header>：头部标签< nav>：导航标签< article>：内容标签< section>：定义文档某个区域< aside>：侧边栏标签< footer>：尾部标签2.视频< video> <video src="文件地址" controls="controls"></video>3.音频标签< audi

网站TDK三大标签SEO优化SEO（Search Engine Optimzation）汉译为搜索引擎优化，是一种搜索引擎的规则提高网站哎有关搜索引擎内自然排名的方式。SEO的目的是对网站进行深度的优化，从而帮助网站获取免费的流量，进而在搜索引擎上提升网站的排名，提高网站的知名度。页面必须有三个标签用来复合SEO优化1.title网站标题title具有不可替代性，是内页的第一个重要标签，是搜索引擎了解网页的入口和对网页猪头归属的最佳判断点建议：网站名（产品名）-网站的介绍（尽量不超过30个汉字

浮动（float)网页布局第一准则：多个块级元素纵向排列找标准流，多个块级元素横向排列找浮动网页布局第二准则：先设置盒子大小，之后设置盒子的位置1.传统页面布局的三种方式网页布局的本质——用CSS来摆放盒子，把盒子摆放到相应位置CSS提供了三种传统布局方式（盒子如何进行排列顺序)普通流浮动定位2.标准流（普通流/文档流）所谓的标准流：就是标签按照规定好默认方式排列1.块级元素会独占一行，从上向下顺序排列常用元素：div、hr、p、h1~h6、ul、ol、dl、form、tabl

CSS定位定位组成定位：将盒子定在某一个位置，所有定位也是在摆放盒子，按照定位的方式移动盒子定位 = 定位模式 + 边偏移1.定位模式定位模式确定元素的定位方式，它通过CSS的position属性来设置，其值可以分为四个：值语义static静态定位relative相对absolute绝对fixed固定2.边偏移边偏移就是定位的盒子移动到最终位置，有top、bottom、left和right四个属性边偏移属性示例描述to

1.精灵图的使用把多个小图标正和到一张图片中移动背景图片位置，此时可以使用 background-position移动的距离就是这个目标图片的x和y坐标，注意网页中的坐标有所不同一般情况都是往上往左移动，所有数值是负数2.字体图标（iconfont）字体图标展示的是图标，本质属于字体1.字体图标下载​ icomoon字库 http://icomoon.io​ 阿里iconfont字库 http://www.iconfont.cn/2.字体图标引入​ 把下载包里面的fonts文件夹放

CSS三大特性CSS有三个非常重要的特性：层叠性、继承性、优先级1.层叠性相同的选择器给设置相同的样式，此时一个样式就会覆盖（层叠）另一个冲突的样式，层叠性主要解决样式冲突的问题原则：样式冲突，遵循的原则是就近原则，哪个样式离结构近，就执行哪个样式样式不冲突，不会层叠2.继承性CSS中的继承：子标签会继承父标签的某些样式，如文本颜色和字号。子元素可以继承父元素的样式（text- ，font- ，line- 这些元素开头的可以继承，以及color属性）行高的继承性body {​

盒子模型页面布局要学习三大核心，盒子模型、浮动 和 定位1.网页布局的本质网页布局过程先准备好相关的网页元素，网页元素基本都是盒子 Box利用CSS设置好盒子样式，然后摆放到相应位置往盒子里面装内容网页布局的核心本质：就是利用CSS摆盒子2.盒子模型（Box Model）组成所谓 盒子模型：就是把HTML页面中的布局元素看作是一个矩形的盒子，也就是一个盛装内容的容器。CSS盒子模型本质上是一个盒子，封装周围的HTML元素，他包括：边框、外边框、内边距 和 实际内容3.边框（bo

CSS的元素显示模式1.什么是元素的显示模式元素显示模式就是元素（标签）以什么方式进行显示，比如< div>自己占一行，比如一行可以放多个< span>​ HTML元素一般分为块元素和行元素2.块元素常见的块元素有< h1>~< h6>、 < p>、< div>、< ul>、< ol>、< li>等，其中< div> 标签是最典型的块元素独占一行高度、宽度、内外边距都可以

CSS的复合选择器1.什么是复合选择器在CSS中，可以根据选择器的类型把选择器分为基础选择器和复合选择器，复合选择器是建立在记住选择器上的，对基本选择器进行聚合形成的。常用的复合选择器包括：后代选择器、子选择器、并集选择器、伪类选择器等等2.后代选择器后代选择器又称为包含选择器，可以选择父元素里面子元素。其写法就是把外层标签写在前面，内层标签写在后面，中间用空格分隔，当标签发生嵌套时，内层标签就成为外层标签的后代上述语法表示选择元素1里面的所有元素23.子选择器子元素选择器只能选择作为某元

flex布局传统布局兼容性好布局繁琐局限性flex弹性布局操作方便PC端浏览器支持情况较差IE 11或更低版本，不支持或仅部分支持1.布局原理任何一个元素都可以指定为flex布局为父元素设为flex布局后，子元素的float、clear和vertical-align属性失效采用Flex布局的元素，称为Flex容器，子元素称为Flex项目就是通过给父盒子添加flex属性，来控制子盒子的位置和排列方式2.flex布局父项常见属性flex-direction：设置主轴的

CSSCSS时层叠样式 表 （Cascading Style Sheets）的简称，有时也会称之为CSS样式表或级联样式表CSS最大价值：由HTML专注去做结构呈现，样式交给CSS，即结构（HTML）和样式（CSS）相分离1.CSS语法规范CSS规则由两个主要的部分构成：选择器以及一条或多条声明选择器时用于指定CSS样式的HTML标签，花括号内是对该对象设置的具体样式属性和属性值以”键值对“的形式出现属性是对指定的兑现设置的样式属性，例如字体大小、文本颜色等属性和属性值之间用英文 " :

表单标签表单作用：收集用户信息，在网页中，我们也需要跟用户进行交互，收集用户资料，此时就需要表单1.表单的组成在HTML中，一个完整的表单通常由表单域、表单控件（也称为表单元素）和提示信3个部分构成。1.1表单域表单域是一个包含表单元素的区域在HTML，标签用于定义表单域，以实现用户信息的收集和传递< form>会把它范围内的表单元素信息提交给服务器常用属性属性属性值作用actionurl地址用于指定接收并处理表单数据的服务器程序的url地址m

1.表格标签1.1表格的主要作用​ 表格主要用于显示、展示数据1.2表格的基本语法1.< table>< /table>是用于定义表格的标签2.< tr>< /tr>标签用于定义表格中的行，必须嵌套在 < table>< /table>标签中3.< td>< /td>用于定义表格中的单元格，必须嵌套在 < tr>< /tr>标签中4.字母td指表格数据（table data）

Web标准Web标准是W3C组织和其他标准化组织制定的一系列标准的集合。W3C(万维网联盟)是国际最著名的标准化组织标准说明结构结构对于网页元素进行整理和分类，先阶段主要学的是HTML表现变现用于设置网页元素的版式、颜色、大小等外观样式，主要指的是CSS行为行为是指网页模型的定义及交互的编写，现阶段主要学的是JavaScript​ Web标准提出的最佳体验方案：结构、样式、行为相分离HTML中的注释和特殊字符1.注释：HTML中的注释以"< !–“开