摘要： JavaScript 数字类型既可以保存整数，也可以保存小数(浮点数）。 1. 数字型进制 最常见的进制有二进制、八进制、十进制、十六进制。 现阶段我们只需要记住，在JS中八进制前面加0，十六进制前面加 0x 2. 数字型范围 JavaScript中数值的最大和最小值 最大值：Number.MAX_ 阅读全文

摘要： 8.1 数据类型简介 为什么需要数据类型 ​ 在计算机中，不同的数据所需占用的存储空间是不同的，为了便于把数据分成所需内存大小不同的数据，充分利用存储空间，于是定义了不同的数据类型。 简单来说，数据类型就是数据的类别型号。比如姓名“张三”，年龄18，这些数据的类型是不一样的。 变量的数据类型 ​ 变 阅读全文

摘要： ```handlebars Document ``` 阅读全文

摘要： 6.变量的概念 6.1 什么是变量 白话：变量就是一个装东西的盒子。 通俗：变量是用于存放数据的容器。 我们通过 变量名 获取数据，甚至数据可以修改。 6.2 变量在内存中的存储 本质：变量是程序在内存中申请的一块用来存放数据的空间。【再给这个变量命名，以便使用变量，在运行过程中，变量值可以改变。】 阅读全文

摘要： 6.1 什么是变量 白话：变量就是一个装东西的盒子。 通俗：变量是用于存放数据的容器。 我们通过 变量名 获取数据，甚至数据可以修改。 6.2 变量在内存中的存储 本质：变量是程序在内存中申请的一块用来存放数据的空间。【再给这个变量命名，以便使用变量。】 类似我们酒店的房间，一个房间就可以看做是一个 阅读全文

摘要： 4. JavaScript注释 4.1 单行注释 为了提高代码的可读性，JS与CSS一样，也提供了注释功能。 JS中的注释主要有两种，分别是 单行注释 和 多行注释。 单行注释的注释方式如下： // 用来注释单行文字（ 快捷键 ctrl + / ） 4.2 多行注释 多行注释的注释方式如下： 快捷键 阅读全文

摘要： 3.1 JavaScript 是什么 JavaScript 是世界上最流行的语言之一，是一种运行在客户端的脚本语言 （Script 是脚本的意思） 脚本语言：不需要编译，运行过程中由 js 解释器( js 引擎）逐行来进行解释并执行 现在也可以基于 Node.js 技术进行服务器端编程 3.2 Ja 阅读全文

摘要： 2.1 计算机组成 2.2 数据存储 1. 计算机内部使用二进制 0 和 1来表示数据。 2. 所有数据，包括文件、图片等最终都是以二进制数据（0 和 1）的形式存放在硬盘中的。 3. 所有程序，包括操作系统，本质都是各种数据，也以二进制数据的形式存放在硬盘中。平时我们所说的安装软件，其实就是把程序 阅读全文

摘要： 1.1 编程 编程： 就是让计算机为解决某个问题而使用某种程序设计语言编写程序代码，并最终得到结果的过程。 计算机程序： 就是计算机所执行的一系列的指令集合，而程序全部都是用我们所掌握的语言来编写的，所以人们要控制计算机一定要通过计算机语言向计算机发出命令。 1.2 计算机语言 计算机语言指用于人与 阅读全文

摘要： 移动端WEB开发之响应式布局 1. 响应式开发原理 1.1 响应式开发原理 就是使用媒体查询针对不同宽度的设备进行布局和样式的设置，从而适配不同设备的目的。 设备的划分情况： + 小于768的为超小屏幕（手机） + 768~992之间的为小屏设备（平板） + 992~1200的中等屏幕（桌面显示器） 阅读全文

摘要： 1、让一些不能等比自适应的元素，达到当设备尺寸发生改变的时候，等比例适配当前设备。 2、使用媒体查询根据不同设备按比例设置html的字体大小，然后页面元素使用rem做尺寸单位，当html字体大小变化，元素尺寸也会发生变化，从而达到等比缩放的适配。 技术方案： 1、less+rem+媒体查询 2、fl 阅读全文

摘要： 维护css弊端 CSS 是一门非程序式语言，没有变量、函数、SCOPE（作用域）等概念。 + CSS 需要书写大量看似没有逻辑的代码，CSS 冗余度是比较高的。 + 不方便维护及扩展，不利于复用。 + CSS 没有很好的计算能力 + 非前端开发工程师来讲，往往会因为缺少 CSS 编写经验而很难写出组 阅读全文

摘要： 什么是媒体查询 媒体查询（Media Query）是CSS3新语法。 + 使用 @media查询，可以针对不同的媒体类型定义不同的样式 + @media 可以针对不同的屏幕尺寸设置不同的样式 + 当你重置浏览器大小的过程中，页面也会根据浏览器的宽度和高度重新渲染页面 + 目前针对很多苹果手机、And 阅读全文

摘要： rem单位 rem (root em)是一个相对单位，类似于em， em是父元素字体大小 。 不同的是， rem的基准是相对于html元素的字体大小 。 rem的优势：父元素文字大小可能不一致， 但是整个页面只有一个html，可以很好来控制整个页面的元素大小。 比如，根元素（html）设置font 阅读全文

摘要： 语法1： background: linear gradient(起始方向, 颜色1, 颜色2, ...); background: webkit linear gradient(left, red , blue); background: webkit linear gradient(left t 阅读全文

摘要： 移动web开发——flex布局 1.传统布局和flex布局对比 1.1传统布局 兼容性好 布局繁琐 局限性，不能再移动端很好的布局 1.2 flex布局 操作方便，布局极其简单，移动端使用比较广泛 pc端浏览器支持情况比较差 IE11或更低版本不支持flex或仅支持部分 1.3 建议 如果是pc端页 阅读全文

摘要： 1.移动端单独制作 流式布局（百分比布局）【百分比%，是跟父元素相对的。】 flex 弹性布局（强烈推荐） less+rem+媒体查询布局 混合布局 2.响应式 媒体查询 bootstarp 流式布局： 流式布局，就是百分比布局，也称非固定像素布局。 通过盒子的宽度设置成百分比来根据屏幕的宽度来进行 阅读全文

摘要： 4.1移动端主流方案 1.单独制作移动端页面（主流） 通常情况下，网址域名前面加 m(mobile)可以打开移动端。通过判断设备，如果是移动设备打开，则跳到移动端页面。 也就是说，PC端和移动端为两套网站，pc端是pc端的样式，移动端再写一套，专门针对移动端适配的一套网站。 京东pc端、移动端： 2 阅读全文

摘要： 移动端2倍图背景图缩放： （1）fireworks中，宽高缩放50%； （2）测量大小、坐标； （3）background-size：宽设置为和fireworks中的宽一样，高设为auto 或 省略。 3.1物理像素&物理像素比 物理像素，就是分辨率。iPhone8的物理像素是750，但是宽度为37 阅读全文

摘要： 视口 ：viewport，就是浏览器显示页面内容的屏幕区域。 视口可以分为布局视口、视觉视口和理想视口 2.1 布局视口 layout viewport 一般移动设备的浏览器都默认设置了一个布局视口，用于解决早期的PC端页面在手机上显示的问题。 iOS、 Android基本都将这个视口分辨率设置为 阅读全文

摘要： 1.1浏览器现状 PC端常见浏览器：360浏览器、谷歌浏览器、火狐浏览器、QQ浏览器、百度浏览器、搜狗浏览器、IE浏览器。 移动端常见浏览器：UC浏览器，QQ浏览器，欧朋浏览器，百度手机浏览器，360安全浏览器，谷歌浏览器，搜狗手机浏览器，猎豹浏览器，以及其他杂牌浏览器。 国内的UC和QQ，百度等手 阅读全文

摘要： 浏览器私有前缀是为了兼容老版本的写法，比较新版本的浏览器无须添加。 1. 私有前缀  moz ：代表 firefox 浏览器私有属性  ms ：代表 ie 浏览器私有属性  webkit ：代表 safari、chrome 私有属性  o ：代表 Opera 私有属性 2. 提倡的写法 mo 阅读全文

摘要： 3D导航栏 旋转木马 阅读全文

摘要： 1. 呈现 1. ☆☆☆☆☆ 控制子元素是否开启三维立体环境 代表子元素不开启 立体空间，默认的 子元素开启立体空间 代码写给父级，但是影响的是子盒子 2. 代码演示 阅读全文

摘要： 旋转 3D 旋转指可以让元素在三维平面内沿着 x 轴、y 轴、z 轴 或者自定义轴进行旋转 1. 语法 沿着 x 轴正方向旋转 45 度 沿着 y 轴正方向旋转 45 度 沿着 z 轴正方向旋转 45 度 沿着自定义轴旋转 45 deg 为角度 2. 代码案例 3. 左手准则 左手的手拇指指向 x 阅读全文

摘要： 【经试验，Z轴的位移距离大于或等于perspective时，元素不显示。】 1. 知识点讲解 如果想要网页产生 效果，需要 透视 (理解成 物体投影在 平面上) 实际上模仿人类的视觉位置，可视为安排一直眼睛去看 透视，也称为 视距 ，所谓的视距，就是人的眼睛到屏幕的距离 【 透视越小，物体看的越大， 阅读全文

摘要： 一、 认识 转换 1. 的特点 近大远小 物体后面遮挡不可见 2. 三维坐标系 x 轴：水平向右 注意：x 轴右边是正值，左边是负值 y 轴：垂直向下 注意：y 轴下面是正值，上面是负值 z 轴：垂直屏幕 注意：往外边的是正值，往里面的是负值 二、 转换 1. 转换知识要点 位移： 【transla 阅读全文

该文被密码保护。 阅读全文

摘要： 转换综合写法以及顺序问题 1. 知识要点 同时使用多个转换，其格式为 顺序会影响到转换的效果(先旋转会改变坐标轴方向) 但我们同时有位置或者其他属性的时候，要将 位移放到最前面 2. 代码演示 阅读全文

摘要： 1. 的作用 用来控制元素的放大与缩小 2. 语法 3. 知识要点 注意，x 与 y 之间使用逗号进行分隔 : 宽高都放大一倍，相当于没有放大 : 宽和高都放大了二倍 : 如果只写了一个参数，第二个参数就和第一个参数一致 : 缩小 最大的优势：可以设置转换中心点缩放，默认以中心点缩放，而且 不影响其 阅读全文

摘要： transform-origin 基础语法 transform-origin: x y; 重要知识点 注意后面的参数 x 和 y 用空格隔开 x、 y 默认旋转的中心点是元素的中心 (50% 50%)，等价于 center center 还可以给 x y 设置像素，或者方位名词(top、bottom 阅读全文

摘要： 1. rotate 旋转 旋转指的是让元素在二维平面内顺时针或者逆时针旋转 2. 语法、使用步骤： （1）给元素添加转换属性 （2）属性值为 ， 如 顺时针方向旋转 30度 3. 重点知识点 里面跟度数，单位是 角度为正时，顺时针，角度为负时，逆时针 默认旋转的中心点是元素的中心点 4. 代码演示 阅读全文

摘要： ```html Document 123 哈哈哈 ``` ![在这里插入图片描述](https://img-blog.csdnimg.cn/20191223154057942.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L21hb3BvbH 阅读全文

摘要： / 移动盒子的位置： 定位、盒子的外边距、2d转换移动 / 1. 转换 转换是改变标签在二维平面上的位置和形状 移动： 【位移】 旋转： 缩放： 2. 语法 x 就是 x 轴上水平移动 y 就是 y 轴上水平移动 3. 重点知识点 的移动主要是指 水平、垂直方向上的移动 最大的优点就是 不影响其他元 阅读全文

摘要： 1. 伪元素选择器 【伪元素：不是真正的元素，但是具有元素的一些特性。】 【 伪类：不是真正的类，但是具有元素的一些特性。】 【类数组：不是真正的数组，但是具有数组的一些特性。】 ::before 在 元素内部的前面 插入内容。 【一个冒号:，也可以，但是两个冒号是最正式的写法。】 ::after 阅读全文

摘要： 如果页面中有两个这样的div结构，则两个第一个<span>我是span</span>，都是pink <div> <p>我是一个p标签</p> <span>我是span</span> <br> <span>我是span</span> <br> <span>我是span</span> <br> </di 阅读全文

摘要： 1. 什么是 在 的基础上拓展、新增的样式 2. 发展现状 移动端支持优于 端 目前还草案，在不断改进中 相对 ，应用非常广泛 3. 属性选择器列表 4.属性选择器代码演示 阅读全文

摘要： ![在这里插入图片描述](https://img-blog.csdnimg.cn/20191222173530426.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L21hb3BvbHVuemk=,size_16,color_FFFFFF,t... 阅读全文

摘要： 移动端的截图： 阅读全文

摘要： 多媒体视频标签 1. video 视频标签 目前支持三种格式 2. 语法格式 3. video 参数 muted：静静的 poster：招贴画; 海报 4. video 代码演示 5. 多媒体标签总结 音频标签与视频标签使用基本一致 多媒体标签在不同浏览器下情况不同，存在兼容性问题 谷歌浏览器把音频 阅读全文

摘要： 多媒体音频标签audio 1. 多媒体标签有两个，分别是 音频 视频 2. 标签说明 可以在不使用标签的情况下，也能够原生的支持音频格式文件的播放， 但是：播放格式是有限的 3. audio 支持的音频格式 audio 目前支持三种格式 4. audio 的参数 5、audio 代码演示 阅读全文

摘要： 一、什么是 1. 的概念与定义 定义： 定义了 标准的最新版本，是对 的第五次重大修改，号称下一代的 两个概念： 是一个新版本的 语言，定义了新的标签、特性和属性 拥有一个强大的技术集，这些技术集是指： 、 、 , 这也是广义上的 2. 拓展了哪些内容 语义化标签 本地存储 兼容特性 、`3D` 动 阅读全文

摘要： ​ 能够安装 VS Code ​ 能够熟练使用 VS Code 软件 ​ 能够安装 VS Code 最常用的插件 VSCode 简介 Visual Studio Code (简称 VS Code / VSC) 是微软公司推出的一款免费开源的现代化轻量级代码编辑器，支持几乎所有主流的开发语言的语法高亮 阅读全文

该文被密码保护。 阅读全文

摘要： :focus 伪类 选择器：用于选取获得焦点的元素 。 我们这里主要针对的是 表单元素。 :hover 语法： ~~~css .total input { border: 1px solid ccc; height: 30px; width: 40px; transition: all .5s; } 阅读全文

该文被密码保护。 阅读全文

摘要： 过渡（transition)是CSS3中具有颠覆性的特征之一，我们可以在不使用 Flash 动画或 JavaScript 的情况下，当元素从一种样式变换为另一种样式时为元素添加效果。 过渡动画： 是从一个状态 渐渐的过渡到另外一个状态 可以让我们页面更好看，更动感十足，虽然 低版本浏览器不支持（ie 阅读全文

摘要： CSS3：background size 1、定义：background size属性规定背景图像的尺寸。 2、用法：background size：length | percentage | cover | contain 属性值： length：设置背景图像的高度高度和宽度。第一个值设置宽度，第 阅读全文

该文被密码保护。 阅读全文

该文被密码保护。 阅读全文

摘要： logo 里面 首先放一个 h1 标签 ，目的是为了提权，告诉搜索引擎，这个地方很重要 h1里面在放一个连接，可以返回首页的， 给连接一个 大小 和 logo 的背景图片 连接 里面要放文字（网站名称），为了搜索引擎收录我们。 但是文字不要显示出来 要用 text indent 移到盒子外面 （te 阅读全文

摘要： 图片是有诸多优点的，但是缺点很明显，比如图片不但增加了总文件的大小，还增加了很多额外的"http请求"，这都会大大降低网页的性能的。更重要的是图片不能很好的进行“缩放”，因为图片放大和缩小会失真。 我们后面会学习移动端响应式，很多情况下希望我们的图标是可以缩放的。此时，一个非常重要的技术出现了，额不 阅读全文

摘要： SEO是由英文Search Engine Optimization缩写而来， 中文意译为“搜索引擎优化”！ 常见的搜索引擎，比如百度，谷歌，雅虎，搜狗等等.. SEO是指通过对网站进行站内优化、网站结构调整、网站内容建设、网站代码优化等)和站外优化，从而提高网站的关键词排名以及公司产品的曝光度。 简 阅读全文

摘要： 1). 使用ico图标 首先把favicon.ico 这个图标放到根目录下。 再html里面， head 之间 引入 代码。 2). 制作ico图标 我们可以自己做的图片，转换为 ico图标，以便放到我们站点里面。 方法步骤： 首先把我们想要的切成图片。 要把图片转换为 ico 图标，我们借助于第三 阅读全文

该文被密码保护。 阅读全文

摘要： ~~~css div { width: 0; height: 0; line height:0； font size: 0; border top: 10px solid red; border right: 10px solid green; border bottom: 10px solid b 阅读全文

摘要： 1). 负边距+定位：水平垂直居中 咱们前面讲过， 一个绝对定位的盒子， 利用 父级盒子的 50%， 然后 往左(上) 走 自己宽度的一半 ，可以实现盒子水平垂直居中。 2). 压住盒子相邻边框 阅读全文

该文被密码保护。 阅读全文

摘要： 5.1 为什么需要精灵技术 图所示为网页的请求原理图，当用户访问一个网站时，需要向服务器发送请求，网页上的每张图像都要经过一次请求才能展现给用户。 然而，一个网页中往往会应用很多小的背景图像作为修饰，当网页中的图像过多时，服务器就会频繁地接受和发送请求，这将大大降低页面的加载速度。 我们为什么需要精 阅读全文

摘要： 4.1 white space white space设置或检索对象内文本显示方式。通常我们使用于强制一行显示内容 ~~~ white space: normal ；默认处理方式 white space: nowrap ；　强制在同一行内显示所有文本，直到文本结束，或者遭遇br标签对象才换行。 ~~ 阅读全文

摘要： 有宽度的块级元素居中对齐，是margin: 0 auto; 文字居中对齐，是 text-align: center; 但是我们从来没有讲过有垂直居中的属性。 vertical-align 垂直对齐，它只针对于行内元素或者行内块元素。 【对于块级元素无效。】 vertical-align : base 阅读全文

摘要： 所谓的界面样式， 就是更改一些用户操作样式，以便提高更好的用户体验。 更改用户的鼠标样式 (滚动条因为兼容性非常差，我们不研究) 表单轮廓等。 防止表单域拖拽 2.1 鼠标样式cursor 设置或检索在对象上移动的鼠标指针采用何种系统预定义的光标形状。 属性值 描述 default 小白 默认 po 阅读全文

摘要： 元素的显示与隐藏 目的 让一个元素在页面中消失或者显示出来 场景 类似网站广告，当我们点击关闭就不见了，但是我们重新刷新页面，会重新出现！ 1.1 display 显示（重点） display 设置或检索对象是否及如何显示。 ~~~ display: none 隐藏对象 display：block 阅读全文

摘要： 粘性定位sticky 粘性定位可以被认为是相对定位和固定定位的混合。元素在跨越特定阈值前为相对定位，之后为固定定位。例如： #one { position: sticky; top: 10px; } 1. CSS 布局的三种机制 网页布局的核心 —— 就是用 CSS 来摆放盒子位置。 CSS 提供了 阅读全文

该文被密码保护。 阅读全文

该文被密码保护。 阅读全文

摘要： “工欲善其事，必先利其器” Chrome浏览器不仅可以调试页面、JS、请求、资源、cookie，还可以模拟手机进行调试。我们现在只是使用html和css，我们先讲一下现在常用的调试。 2.1 怎样打开Chrome的开发者工具？ 直接在页面上点击右键，然后选择 “检查” 快捷键 F12 或者 ctrl 阅读全文

摘要： 为了提高网页制作的效率，布局时通常有以下的布局流程，具体如下： 1、必须确定页面的 版心（可视区） ， 我们测量可得知。【 公共类样式 】 2、分析页面中的 行模块 ，以及每个行模块中的 列模块 。其实页面布局，就是一行行罗列而成。 3、制作 HTML结构 。我们还是遵循，先有结构，后有样式的原则， 阅读全文

摘要： 建议遵循以下顺序： 1. 布局定位属性：display / position / float / clear / visibility / overflow（建议 display 第一个写，毕竟关系到模式） 2. 自身属性：width / height / margin / padding / bo 阅读全文

摘要： 常见的图片格式 PS切图 可以 分为 利用切片工具切图 以及 利用PS的插件快速切图。 1). PS切片工具 ps切图片，分两大步： 1). 用切片选中图片 利用切片工具手动划出 图层菜单 新建基于图层的切片 利用辅助线 来切图 基于参考线的切片 2). 导出切片 文件菜单 存储为web设备所用格式 阅读全文

摘要： 浮动： 1、浮动的元素脱标。如果一个元素浮动了，那么，（1）将能够【无缝】并排了；（2）并且能够设置宽高了，无论它原来是个div还是个span，浮动即脱离标准流，inline、block是在标准流里用的。 2、浮动的元素互相贴靠。左浮动就会贴左边，右浮动贴右边，贴上一个兄弟元素的边。 3、浮动的元素 阅读全文

摘要： 开始就形成良好的书写规范，是你专业的开始。 空格规范 【强制】 选择器 与 { 之间必须包含空格。 示例： ~~~css .selector { } ~~~ 【强制】 属性名 与之后的 : 之间不允许包含空格， : 与 属性值 之间必须包含空格。 示例： ~~~css font size: 12px 阅读全文

摘要： 语法: box-shadow:水平阴影 垂直阴影 模糊距离（虚实） 阴影尺寸（影子大小） 阴影颜色 内/外阴影； 前两个属性是必须写的，其余的可以省略。 h-shadow：值为正数时，阴影往右移动，反之，往左移动。 v-shadow：值为正数时，阴影往下移动，反之，往上移动。 blur：值0，就是纯 阅读全文

摘要： 语法： 其中每一个值可以为 数值或 百分比 的形式。 技巧： 让一个正方形 变成圆圈 ~~~ border radius: 50%; ~~~ 以上效果图矩形的圆角， 就不要用 百分比了，因为百分比会是表示高度和宽度的一半。 而我们这里矩形就只用 用 高度的一半就好了。精确单位。 阅读全文

摘要： 盒子模型（CSS重点） css三大重点： css 盒子模型 、 浮动 、 定位 主题思路： 1.看透网页布局的本质 网页布局中，我们是如何把里面的文字，图片，按照美工给我们的效果图排列的整齐有序呢？ 看透网页布局的本质： 首先利用CSS设置好盒子的大小，然后摆放盒子的位置。 最后把网页元素放入盒子里 阅读全文

摘要： CSS注释规则： 例如： 阅读全文

摘要： 选择器相同，则执行层叠性 【权重相同，就根据就近原则】 选择器不同，就会出现优先级的问题。 如果选中了，那么以公式来计权重，谁大听谁的。 如果没选中，那么权重是0，因为继承的权重为0。 目标： 理解 能说出css样式冲突采取的原则 能说出那些常见的样式会有继承 应用 能写出CSS优先级的算法 能会计 阅读全文

摘要： 目标 理解 背景的作用 css背景图片和插入图片的区别 应用 通过css背景属性，给页面元素添加背景样式 能设置不同的背景图片位置 【插入图片，不用设置img元素的父元素、自身元素大小，即可见，但是背景图要设置元素的宽高才可见。】 4.1 背景颜色(color) 语法： 4.2 背景图片(image 阅读全文

摘要： 目标 理解 能说出 行高 和 高度 三种关系 能简单理解为什么行高等于高度单行文字会垂直居中 应用 使用行高实现单行文字垂直居中 能会测量行高 3.1 行高测量 行高的测量方法： 3.2 单行文本垂直居中 行高我们利用最多的一个地方是： 可以让单行文本在盒子中垂直居中对齐。 文字的行高等于盒子的高度 阅读全文

摘要： 目标： 理解 标签的三种显示模式 三种显示模式的特点以及区别 理解三种显示模式的相互转化 应用 实现三种显示模式的相互转化 2.1 什么是标签显示模式 什么是标签的显示模式？ 标签以什么方式进行显示，比如div 自己占一行， 比如span 一行可以放很多个 作用： 我们网页的标签非常多，再不同地方会 阅读全文

摘要： 重点： 复合选择器 后代选择器 并集选择器 标签显示模式 CSS背景 背景位置 CSS三大特性 优先级 1. CSS复合选择器 目标 理解 理解css复合选择器分别的应用场景 应用 使用后代选择器给元素添加样式 使用并集选择器给元素添加样式 使用伪类选择器 为什么要学习css复合选择器 CSS选择器 阅读全文

摘要： Emmet的前身是Zen coding,它使用缩写,来提高html/css的编写速度。 1. 生成标签 直接输入标签名 按tab键即可 比如 div 然后tab 键， 就可以生成 2. 如果想要生成多个相同标签 加上 就可以了 比如 div 3 就可以快速生成3个div 3. 如果有父子级关系的标签 阅读全文

摘要： 此工具是我们的必备工具，以后代码出了问题 我们首先第一反应就是： “按F12”或者是 “shift+ctrl+i” 打开 开发者工具。 菜单： 右击网页空白出 检查 通过开发人员工具小指针工具，查找页面元素 左侧是html页面结构，右侧是css样式 小技巧： 1. ctrl+滚轮 可以 放大开发者工 阅读全文

摘要： CSS字体样式属性、调试工具 目标 应用 使用css字体样式完成对字体的设置 使用css外观属性给页面元素添加样式 使用常用的emment语法 能够使用开发人员工具代码调试 1.font字体 1.1 font size:大小 作用： font size属性用于设置字号 ~~~css p { font 阅读全文

摘要： 1. CSS选择器作用（重点） 要把小黄人分为2组，最快的方法怎办？ 很多， 比如 一只眼睛的一组，剩下的一组 选择器的作用 ​ 找到特定的HTML页面元素 一句话说出他们： ※※※※ CSS选择器干啥的？ 选择标签用的， 把我们想要的标签选择出来 必须记住的 css 就是 分两件事， 选对人， 做 阅读全文

摘要： typora copy images to: media 第01阶段.前端基础.CSS初识 CSS层叠样式表 学习目标 理解 css的目的作用 css的三种引入方式 应用 css三种引用方式的书写 通过样式规则给标签添加简单的样式 1.HTML的局限性 说起HTML，这其实是个非常单纯的家伙， 他只 阅读全文

摘要： 目标： 能写出最常用的注册类表单 能说出input表单常见属性 现实中的表单，类似我们去银行办理信用卡填写的单子。 如下图 作用： 表单目的是为了收集用户信息。 在我们网页中， 我们也需要跟用户进行交互，收集用户资料，此时也需要表单。 在HTML中，一个完整的表单通常由表单控件（也称为表单元素）、提 阅读全文

摘要： 1. 列表标签（重点） 学习目标 理解 无序列表的应用场景 自定义列表的应用场景 应用 无序列表语法 自定义列表语法 问？ 前面我们知道表格一般用于数据展示的，但是网页中还是有很多跟表格类似的布局，如下图~~ 我们用什么做呢？ 答： 答案是列表， 那什么是列表？ 表格是用来显示数据的，那么列表就是用 阅读全文

摘要： 第01阶段.前端基础.表格 表格 table 目标： 理解： 能说出表格用来做什么的 表格的基本结构组成 应用： 能够熟练写出n行n列的表格 能简单的合并单元格 ​ 表格作用： 存在即是合理的。 表格的现在还是较为常用的一种标签，但不是用来布局， 常见显示、展示表格式数据。 因为它可以让数据显示的非 阅读全文

摘要： 1.“.”表示当前目录 【注意，是目录。】 2.“..” 表示当前目录的上一级目录。 3.“./”表示当前目录下的某个文件或文件夹，视后面跟着的名字而定 4.“../”表示当前目录上一级目录的文件或文件夹，视后面跟着的名字而定。 实际工作中，我们的文件不能随便乱放，否则用起来很难快速的找到他们，因此 阅读全文

摘要： 学习目标 理解： 相对路径三种形式 应用 排版标签 文本格式化标签 图像标签 链接 相对路径，绝对路径的使用 1. HTML常用标签 首先 HTML和CSS是两种完全不同的语言，我们学的是结构，就只写HTML标签，认识标签就可以了。 不会再给结构标签指定样式了。 HTML标签有很多，这里我们学习最为 阅读全文

摘要： @[TOC本篇文章分两部分，第一部分可以列为初为新人的装逼失败模式，第二部分列为修炼低调模式。 装逼失败模式：99%的人对GET和POST的认识 修炼低调模式：1%不知道的进阶认识 GET和POST，在我们日常WEB开发中，是最常用的数据传输方式。面试中我们也经常会遇到。 一般我们在浏览器输入一个网 阅读全文

摘要： 学习目标 理解 1、HTML的概念 2、HTML标签的分类 3、HTML标签的关系 4、HTML标签的语义化 应用 1、HTML骨架格式 2、sublime基本使用 1. HTML 初识 HTML 指的是超文本标记语言 ( H yper T ext M arkup L anguage)是用来描述网页 阅读全文

摘要： 认识WEB 1. 认识网页 `` 网页主要由文字、图像和超链接等元素构成。当然，除了这些元素，网页中还可以包含音频、视频以及Flash等。 `` 思考： 网页是如何形成的呢? 总结 网页有图片、链接、文字等元素组成，我们后面的任务就是要把这部分网页元素用代码写出来。。。 2. 浏览器（显示代码） 浏 阅读全文