摘要: rem是什么? rem是一个长度单位,常用的长度单位有: * px: 绝对长度单位,最常用 * em: 相对长对单位,相对于父元素,不常用 * rem: 相对长度单位,相对于根元素,常用于响应式布局 响应式布局的常用方案: * media-query ,根据不同的屏幕宽度设置根元素 font-siz 阅读全文
posted @ 2019-08-13 18:34 yangkangkang 阅读(490) 评论(0) 推荐(0) 编辑
摘要: 父元素设置ling-height;子元素继承父元素的line-height 1.ling-height:固定像素 此时p元素的line-height = 24px 2.line-height: 百分比 此时p元素的 行高是body 计算之后的。line-height = 200% * 20 = 40 阅读全文
posted @ 2019-08-13 18:16 yangkangkang 阅读(441) 评论(0) 推荐(0) 编辑
摘要: 水平居中 行内元素: * 如果父元素是块级元素,则直接给父元素设置text-align:center; * 如果父元素是不是块级元素,先将父元素设置为块级元素,再给父元素设置text-align:center; 块级元素: * 需要谁居中,给其设置 margin: 0 auto * 父元素设置相对定 阅读全文
posted @ 2019-08-13 17:05 yangkangkang 阅读(227) 评论(0) 推荐(0) 编辑
摘要: 实现麻将中三点筛子:效果如下图 具体实现代码: html代码: css 代码: 阅读全文
posted @ 2019-08-13 16:35 yangkangkang 阅读(660) 评论(0) 推荐(1) 编辑
摘要: 一、什么是 Flex 布局? flex(Flexible Box)意为“弹性盒子”,用来为盒状模型提供最大的灵活性。 将一个容器指定为Flex布局: display:flex; 行元素也可使用flex 布局: display:inline-flex; 注:设置为flex布局以后,子元素的float、 阅读全文
posted @ 2019-08-13 15:40 yangkangkang 阅读(149) 评论(0) 推荐(0) 编辑
摘要: 圣杯布局和双飞翼布局的目的: 1.三栏布局,中间一栏最先加载和渲染(内容最重要) 2. 两侧内容固定,中间内容随着宽度自适应 3. 一般用于 PC 网页 圣杯布局实现思路: 1. 将最外层的container的padding 设置为 padding: 0 150px 0 200px; 为左右两块让出 阅读全文
posted @ 2019-08-13 11:45 yangkangkang 阅读(135) 评论(0) 推荐(0) 编辑