摘要: 鼠标点击事件就是当鼠标点击元素时,就会出现另一个窗口,类似于百度首页中右上角的“登录”这个按钮,当鼠标点击 登录时,就会出现登录窗口。大体的意思就是这样,直接上代码了,简单易懂。 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> 阅读全文
posted @ 2016-08-13 14:26 爱吃de馒头 阅读(27657) 评论(2) 推荐(0) 编辑
摘要: 代码: <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>心跳</title> <style type="text/css"> div img{ width: 400px; position: relative; 阅读全文
posted @ 2016-08-05 13:56 爱吃de馒头 阅读(309) 评论(0) 推荐(0) 编辑
摘要: 所用的图片:等等······,可以自己添加图片 代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>六边形</title> <style type="text/css"> body{ background: b 阅读全文
posted @ 2016-08-05 13:54 爱吃de馒头 阅读(371) 评论(0) 推荐(0) 编辑
摘要: 一、过度动画:transition 五个属性: transition-property css 样式属性名称 transition-duration 动画持续时间(需要单位s) transition-timing-function 动画效果函数名称 linear、ease、ease-in、ease- 阅读全文
posted @ 2016-08-04 22:50 爱吃de馒头 阅读(212) 评论(0) 推荐(0) 编辑
摘要: 一、渐变:gradients 线性渐变(linear gradients) background:-webkit-linear-gradient(90deg,red 10%,blue); 1、需要有内核前缀 2、方向可以为字母或者角度(left top right bottom) 3、为角度时逆时针 阅读全文
posted @ 2016-08-04 22:36 爱吃de馒头 阅读(150) 评论(0) 推荐(0) 编辑
摘要: 子元素选择器: div>p{background:yellow;} 相邻的后兄弟选择器(必须相邻) h1+p{padding-top:20px;} 后兄弟选择器(同级的当前元素后面的元素) div~p{color:red;} 属性选择器:(属性可以自己定义,例如:class=abc) [abc=va 阅读全文
posted @ 2016-08-04 22:12 爱吃de馒头 阅读(150) 评论(0) 推荐(0) 编辑
摘要: 一、流式布局 不再使用px作为盒模型布局,而是采用百分比布局宽高,定位等。 公式:目标元素宽度/上下文元素宽度=百分比宽度 目标定位/上下文元素宽度或高度=定位距离(保留5位小数点) 用em/rem来替换px 1、em的值并不是固定的; 2、em会继承父级元素的字体大小。 3、rem为css新增属性 阅读全文
posted @ 2016-08-04 21:50 爱吃de馒头 阅读(236) 评论(0) 推荐(1) 编辑
摘要: 1、所有的元素设置了浮动后都可以设置宽高。 2、行元素都不能设置宽高跟上下边距 3、所有的css样式优先级中“!important”优先级最高(及其不推荐使用) 4、改变元素的transition值,不会影响其他元素在页面中的位置。 5、transition的duration(动画运动时间)不能省略 阅读全文
posted @ 2016-08-01 21:38 爱吃de馒头 阅读(301) 评论(0) 推荐(0) 编辑
摘要: 1、overflow:设置当内容超出父级的宽高尺寸设置时的处理方式 a、hidden:隐藏超出部分的内容 b、auto:如果内容没有超出,就正常显示,如果超出,就隐藏内容并提供滚动条,可以滚动显示超出部分的内容 c、scroll:始终显示滚动条 d、overflow-x:功能同上,设置x方向内容溢出 阅读全文
posted @ 2016-08-01 21:36 爱吃de馒头 阅读(185) 评论(0) 推荐(0) 编辑
摘要: 一、表格 1、表格标签 a、table 表格 b、thead 表格头 c、tbody 表格主体 d、tr 表格行 e、th 元素定义表头 f、td 元素定义表格单元 2、表格样式重置 a、table{border-collapse:collapse;}单元格间隙合并(默认:separate分隔) b 阅读全文
posted @ 2016-08-01 20:41 爱吃de馒头 阅读(4611) 评论(0) 推荐(0) 编辑