- 博客(20)
- 收藏
- 关注
RSS订阅
1原创 前端学习第18天：CSS3-3D-动画
第18天1. 3D CSS3 中的 3D 变换主要包括以下几种功能函数：3D位移：CSS3 中的 3D 位移主要包括translateZ()和 translate3d()两个功能函数；3D旋转：CSS3 中的 3D 旋转主要包括rotateX()、rotateY()、rotateZ()和rotate3d(1,1,0,4deg) 四个功能函数；4个参数，前三个，对应x,y,z 轴，是标示...
2019-08-15 20:32:04
168
原创 前端学习第17天：C3-渐变-过渡-2D转换
第17天1.CSS渐变 说明：渐变是CSS3当中比较丰富多彩的一个特性，通过渐变我们可以实现许多炫丽的效果，有效的减少图片的使用数量，并且具有很强的适应性和可扩展性。1.1线性渐变(linear-gradient) 说明：线性渐变指沿着某条直线朝一个方向产生渐变效果，如下图是从红色渐变到蓝色。to left、top right、to bottom、to topdiv { bac...
2019-08-15 20:30:34
338
原创 前端学习第16天：媒体查询-响应式布局
第16天1.媒体查询 说明：媒体查询可以让我们根据设备显示器的特性（如视口宽度、屏幕比例、设备方向：横向或纵向）为其设定CSS样式，媒体查询由媒体类型和一个或多个检测媒体特性的条件表达式组成。媒体查询中可用于检测的媒体特性有width 、 height 和color（等）。使用媒体查询，可以在不改变页面内容的情况下，为特定的一些输出设备定制显示效果。1.1媒体查询操作方式 实际操作为：...
2019-08-15 20:26:47
284
原创 前端学习第15天：背景属性-弹性盒子-rem,em,v,vh单位
第十五天1.背景属性1.1背景原点(background-origin) 语法：div{ /* 以边框为原点 */ background-origin:border-box; /* 以padding为原点 */ background-origin:padding-box; /* 以内容边缘为原点 */ background-origin:content...
2019-08-15 20:25:51
231
原创 前端学习第14天：初识CSS3
第14天1.CSS3简介 如同人类的的进化一样，CSS3是 CSS2 的“进化”版本，在 CSS2基础上，增强或新增了许多特性， 弥补了CSS2的众多不足之处，使得Web开发变得更为高效和便捷。1.1CSS3现状- 浏览器支持成都差，需要添加私有前缀- 移动端支持优于`PC`端- 不断改进中- 应用相对广泛1.2如何对待- 坚持<font color="red">...
2019-08-15 20:24:08
156
原创 前端学习第13天：初识H5
第13天1.H5新的文档声明1.1 H4的文档声明1.2 H5的文档声明 怪异盒模型：DOCTYPE缺失则在ie6，ie7，ie8下将会触发怪异模式（quirks 模式）。 当不对doctype进行定义时，会触发怪异模式。在标准模式下，一个块的总宽度= width + margin(左右) + padding(左右) + border(左右)在怪异模式下，一个块的总宽度=...
2019-08-15 20:23:22
203
原创 前端学习第12天：表单补充-网页添加图标
第12天1.表单标签及属性补充 表单作业：手机用户信息 表单组成： 表单域+表单控件1.1表单字段集 语法：<fieldset disabled="disabled"></fieldset> 说明： 相当于一个方框，在字段集中可以包含文本和其他元素。该元素用于对表单中的元素进行分组并在文档中区别标出文本。fieldset元素可以嵌套，...
2019-08-15 20:22:41
247
原创 前端学习第11天：高度自适应
第11天1.高度自适应 说明：网页布局中经常要定义元素的宽和高。但很多时候我们希望元素的大小能够根据窗口或子元素自动调整，这就是自适应元素自适应在网页布局中非常重要，它能够使网页显示更灵活，可以适应在不同设备、不同窗口和不同分辨率下显示。(1)宽度自适应 元素宽度设置为100%。（块元素宽度默认为100%）width:100%;(2) 高度自适应 元素{height:auto;...
2019-08-15 20:20:26
402
原创 前端学习第10天：精灵图-滑动门
第10天1.精灵图1.1背景 网页的请求原理图，当用户访问一个网站时，需要向服务器发送请求，网页上的每张图像都要经过一次请求才能展现给用户。然而，一个网页中往往会应用很多小的背景图像作为修饰，当网页中的图像过多时，服务器就会频繁地接受和发送请求，这将大大降低页面的加载速度。为了有效地减少服务器接受和发送请求的次数，提高页面的加载速度，出现了CSS精灵技术（也称CSS Sprites、CSS...
2019-08-15 20:19:53
234
原创 前端学习第9天：定位
第9天1.定位(position)1.1元素定位的属性边偏移top:相对于父元素上边线距离。bottom:相对于父元素下边线的距离。left:相对于父元素左边线的距离。right:相对于父元素右边线的距离。定位模式static：静态定位。（默认值）relative:相对定位，相对自身位置定位，原位置依然占有空间。absolute:绝对定位，相对父元素定位，脱离标准量...
2019-08-15 20:19:04
112
原创 前端学习第8天：元素类型
第八天1.元素类型1.1 块状元素（block element）独占一行，显示为矩形区域，自上而下排列，可自定义宽高。常见块状元素： div ,dl ,dt , dd, ol , ul , fieldset ,(h1-h6), p , for1.2行内元素/ 内联元素（inline element）没有固定的形状，不能自定义宽高，其宽度和高度由内容撑开，可水平逐个排列常见行内元...
2019-08-15 20:18:34
150
原创 前端学习第5天：盒模型
第五天1.盒模型1.1盒模型组成 margin ：外边距 ~>盒子与盒子之间的距离 padding：内边距 ~>盒子边框到内容的距离1.2 相邻块外边距合并问题（margin塌陷） 上下两个相邻盒子分别使用 margin-bottom 和 margin-top 时，实际的外边距距离为较大的一个值，并不会相加。1.3嵌套块垂直外边距合并问题 对于两个嵌套关系的块...
2019-08-15 20:17:45
129
原创 前端学习第4天：css-文本样式
第四天1.文本样式属性1.1字体类型 font-family 语法：{ font-familu:字体1，字体2，字体3；}<!-- 当字体名是单个英文单词时，不加引号 -->{ font-family:SimSun；}<!-- 当字体名是中文时，需要加引号 -->{ font-family:"微软雅黑"；}<!-- 当字体名中有空格时...
2019-08-15 20:17:06
195
原创 前端学习第3天：初识CSS
第三天：CSS1.Css 样式规则：选择器{ 声明-> 属性：属性值;}说明：- 每个 `CSS `样式由选择器和声明组成，声明由属性和属性值组成，且由分号（；）结束。- 一个属性有多个属性值得时候，属性值与属性值不分先后。2.样式表的简历和优先级### 2.1内部样式表： 语法：<style type = "style/css"> 样式<...
2019-08-14 13:46:12
297
原创 前端初学第2天
第二天重点web标准结构标准：结构用于对网页元素进行整理和分类，主要包括xml 和 xhtml 两个部分。样式标准：表现用于设置网页版的板式、颜色、大小等外观，主要指 css。行为标准：行为是指网页模型的定义及交互的编写，主要包括DOM 和ECMAScript 两个部分。...
2019-08-14 13:45:00
166
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人