摘要:
本次内容 字体图标 css3 2d和3d 字体图标 优点 1 可以做出和图片一样的事情 2 本质是文字,所以可以任意去修改颜色 大小 阴影 。。。。 3 本身体积小 携带的信息没有削减 4 几乎所有浏览器支持,移动设备必备良药 使用 场景 公司内部自己设计图标 1 UI设 计字体图标效果图 (svg 阅读全文
摘要:
css雪碧技术 css精灵是处理网页背景图的方式,它将一个页面涉及的所有零星背景图集中到一张大图上,把大图应用在网页中下周一字体图标 布局案例BFCPS 周三周五 首页 下下周 css3 06css精灵技术(1).html 阅读全文
摘要:
word-break属性 处理英文单词 参考代码03white-space white-space:nowrap 强制一行显示文本 text-overflow 文本溢出 css雪碧技术 css精灵是处理网页背景图的方式,它将一个页面涉及的所有零星背景图集中到一张大图上,把大图应用在网页中下周一 03 阅读全文
摘要:
图片默认底部3px缝隙 解决办法 display:block 或vertical-align: topword-break属性 处理英文单词 参考代码03 02图片默认3px缝隙(1).html 阅读全文
摘要:
图片与文字对齐 text-align: center 文字水平对齐 margin: 0 auto 对有宽度的块级盒子水平居中 vertical-align 控制元素垂直对齐方式 对块级元素无效 对行内元素或者行内块元素有效 通常用来控制图片 取值 baseline | top | middle | 阅读全文
摘要:
鼠标相关样式 参考代码或http://www.w3school.com.cn/cssref/pr_class_cursor.asp 表单轮廓线 取消轮廓线 outline: 0;防止文本域拖拽 resize:none; word-break white-space vertical-align cs 阅读全文
摘要:
元素的显示和隐藏 display: none; /* 隐藏元素 不是删除 只不过看不见 不保留位置*/ visibility: hidden;/*隐藏元素 它保留位置*/overflow overflow: visible; /*超出显示*/ overflow: hidden; /*超出隐藏*/ o 阅读全文
摘要:
z-index 当对多个元素设置定位时,重叠的定位元素可以通过z-index调整堆叠顺序 其值可以为0 正数 负数 特点 1 z-index默认值为0 取值越大 定位元素在层叠元素上越局上 2 z-index取值一样,后来居上 3 z-index值不能加单位 4 只有定位元素才有该属性,其余如浮动等 阅读全文
摘要:
z-index 当对多个元素设置定位时,重叠的定位元素可以通过z-index调整堆叠顺序 其值可以为0 正数 负数 特点 1 z-index默认值为0 取值越大 定位元素在层叠元素上越局上 2 z-index取值一样,后来居上 3 z-index值不能加单位 4 只有定位元素才有该属性,其余如浮动等 阅读全文
摘要:
定位 静态定位 position: static 相对定位 position: relative 绝对定位 position: absolute 脱标 参考点 子绝父相 让绝对定位的盒子水平居中和垂直居中 固定定位 position: fixed 参考点 浏览器左上角 固定定位的元素脱标不占有位置 阅读全文