公告：haoyongliang.gitee.io暂停访问

本章主要介绍变量和数据类型转换，以及字符串的拼接问题 思维导图 编程语言编程 编程： 就是让计算机为解决某个问题而使用某种程序设计语言编写程序代码，并最终得到结果的过程。 计算机程序： 就是计算机所执行的一系列的指令集合，而程序全部都是用我们所掌握的语言来编写的，所以人们要控制计算机一定要通 ...

思维导图 响应式开发原理响应式开发原理就是使用媒体查询针对不同宽度的设备进行布局和样式的设置，从而适配不同设备的目的。 设备的划分情况： 小于768的为超小屏幕（手机） 768~992之间的为小屏设备（平板） 992~1200的中等屏幕（桌面显示器） 大于1200的宽屏设备（大桌面显示器） 响应 ...

思维导图 rem单位rem (root em)是一个相对单位，类似于em，em是父元素字体大小。 不同的是rem的基准是相对于html元素的字体大小。 比如，根元素（html）设置font-size=12px; 非根元素设置width:2rem; 则换成px表示就是24px。 12345678/* ...

思维导图 传统布局和flex布局对比传统布局特点兼容性好 布局繁琐 局限性，不能再移动端很好的布局 flex布局特点操作方便，布局极其简单，移动端使用比较广泛 pc端浏览器支持情况比较差 IE11或更低版本不支持flex或仅支持部分 建议移动端 或者 PC端不需要兼容低版本浏览器 就可以使用用fl ...

本章介绍2d，3d转换和动画 思维导图 transform(2D)移动盒子translate ★ 格式1 transform:translate(x,y) 格式2 transform:translateX(x) 格式3 transform:translateY(y) 括号中写X轴和Y轴的 ...

本章介绍H5新标签，属性选择器、结构伪类选择器、伪元素选择器、C3盒模型、图片模糊处理 思维导图 HTML5新特性概述HTML5 的新增特性主要是针对于以前的不足，增加了一些新的标签、新的表单和新的表单属性等。 这些新特性都有兼容性问题，基本是 IE9+ 以上版本的浏览器才支持，如果不考虑兼容 ...

本章介绍精灵图、字体图标、CSS三角形、鼠标样式、输入框轮廓、图片和文本居中、溢出文本省略号、PC端CSS初始化样式 思维导图 精灵图（重点）为什么需要精灵图 一个网页中往往会应用很多小的背景图像作为修饰，当网页中的图像过多时，服务器就会频繁地接收和发送请求图片，造成服务器请求压力过大，这将大大 ...

本章介绍 定位，浮动，隐藏 思维导图 定位(position) 介绍为什么使用定位我们先来看一个效果，同时思考一下用标准流或浮动能否实现类似的效果？ 场景1： 某个元素可以自由的在一个盒子内移动位置，并且压住其他盒子. 场景2：当我们滚动窗口的时候，盒子是固定屏幕某个位置的。 ...

本章介绍圆角边框、盒子和文本阴影、浮动、PS切图 思维导图 圆角边框在 CSS3 中，新增了圆角边框样式border-radius，这样我们的盒子就可以变圆角了。 语法 1border-radius:value; 参数值可以为数值或百分比的形式如果是正方形，想要设置为一个圆，把数值修改为 ...

本章介绍CSS三大特性、盒模型、边框、内边距、外边距 思维导图 css三大特性层叠性 概念 相同选择器给设置相同的样式，此时一个样式就会覆盖（层叠）另一个冲突的样式。层叠性主要解决样式冲突的问题 层叠性原则 样式冲突，遵循的原则是就近原则，哪个样式离结构近，就执行哪个样式样式不冲突，不会 ...