2019年08月_从0到1，从1到0

原创 3D转换+关键帧动画

css3 3D转换 CSS 3D转换transform(3D位移、缩放、旋转) 让元素方式3d的变换，同2d变换一样，通过transform来设置位移：translate3D(x,y,z) 缩放：scale3d(x,y,z) scalez()不能单独使用；旋转：rotatex(80deg) rotatey(80deg) rotatez(80deg) 它如何工作？ ...

2019-08-07 18:52:50 635

原创 css3中的2d转换及过渡动画

CSS3 渐变的用法线性渐变（Linear Gradient）- 向下/向上/向左/向右/对角方向径向渐变（Radial Gradient）- 由它们的中心定义 repeating-linear-gradient() 函数用于重复线性渐变：线性渐变（默认从上向下） 1、background: linear-gradient(red, blue); 基本的渐变，默认从上向下 2、...

2019-08-06 19:03:38 479

原创移动端页面布局（响应式布局）以及meta标签的设置

响应式网站设计什么是响应式布局？ 1、服务器根据不同的浏览器用户端，为用户呈现不同的页面效果。 2、可以让一个网站兼容不同分辨率的设备，给用户更好的视觉使用体验。 3、移动互联网催生了响应式布局的诞生。响应式设计优缺点优点: 解决了设备之间的差异化展示,让不同的设备达到最优的视觉体验. 缺点: 兼容性代码多,工作量大,加载速度受影响对原有网站布局会产生影响,用户判断未必精确. 响应...

2019-08-06 13:32:46 1826

原创弹性盒和怪异盒模型、多栏布局

1、怪异盒模型浏览器对盒模型的解析一共有两种模式，一种是标准模式，另一种就是怪异模式。一般在页面头部声明了DOCTYPE，都会触发标准模式，而如果DOCTYPE缺失则在ie6，ie7，ie8下将会触发怪异模式（quirks 模式）。标准盒模型和怪异盒模型的区别：在标准模式下，一个块的总宽度= width + margin(左右) + padding(左右) + border(左右) 在怪异...

2019-08-05 19:34:29 280

原创 CSS选择器（CSS核心属性）

CSS即层叠样式表（Cascading StyleSheet） CSS3是CSS技术的升级版本，CSS3语言开发是朝着模块化发展的模块包括：盒子模型、列表模块、超链接方式、语言模块、背景和边框、文字特效、多栏布局等 CSS 用于控制网页的样式和布局。 CSS3 是最新的 CSS 标准。 CSS3 完全向后兼容，因此不必改变现有的设计。浏览器通常支持 CSS2。 CSS3把很多以前需要使...

2019-08-05 18:52:19 261

原创 HTML5新增元素和属性

HTML5的特点 1、语法更宽松 2、结构更简单、清晰 3、标签语义化 4、多设备跨平台 5、自适应网页设计 HTML5新增的结构标签 1.header header 标签定义文档或者文档的一部分区域的页眉。一般作为介绍内容或者导航链接栏的容器。在一个文档中，可以定义多个 <header> 元素。 **注：<header> 标签不能被放在 <footer>、&...

2019-08-01 20:47:28 376