08 2019 档案

响应式布局

摘要：rem是什么？ rem是一个长度单位,常用的长度单位有： * px: 绝对长度单位，最常用 * em: 相对长对单位，相对于父元素，不常用 * rem: 相对长度单位，相对于根元素，常用于响应式布局 * vw: 视口宽度， 100vw = 可视窗口的宽度 * vh: 视口高度，100vh = 可视窗阅读全文

posted @ 2019-08-13 18:34 yangkangkang 阅读(494) 评论(0) 推荐(0) 编辑

line-height继承

摘要：父元素设置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 阅读(445) 评论(0) 推荐(0) 编辑

水平居中和垂直居中方法总结

摘要：水平居中行内元素： * 如果父元素是块级元素，则直接给父元素设置text-align:center; * 如果父元素是不是块级元素，先将父元素设置为块级元素，再给父元素设置text-align:center; 块级元素: * 需要谁居中，给其设置 margin: 0 auto * 父元素设置相对定阅读全文

posted @ 2019-08-13 17:05 yangkangkang 阅读(234) 评论(0) 推荐(0) 编辑

flex 布局实现三点筛子

摘要：实现麻将中三点筛子：效果如下图具体实现代码： html代码： css 代码：阅读全文

posted @ 2019-08-13 16:35 yangkangkang 阅读(682) 评论(0) 推荐(1) 编辑

flex 布局

摘要：一、什么是 Flex 布局？ flex（Flexible Box）意为“弹性盒子”，用来为盒状模型提供最大的灵活性。将一个容器指定为Flex布局： display：flex; 行元素也可使用flex 布局： display:inline-flex; 注：设置为flex布局以后，子元素的float、阅读全文

posted @ 2019-08-13 15:40 yangkangkang 阅读(215) 评论(0) 推荐(0) 编辑

圣杯布局和双飞翼布局

摘要：圣杯布局和双飞翼布局的目的： 1.三栏布局，中间一栏最先加载和渲染（内容最重要） 2. 两侧内容固定，中间内容随着宽度自适应 3. 一般用于 PC 网页圣杯布局实现思路： 1. 将最外层的container的padding 设置为 padding: 0 150px 0 200px; 为左右两块让出阅读全文

posted @ 2019-08-13 11:45 yangkangkang 阅读(139) 评论(0) 推荐(0) 编辑

margin 负值问题

摘要：* margin-top 和 margin-left 负值，自身元素向上、向左移动； * margin-right 负值，右侧元素左移，自身元素不受影响； * margin-bottom 负值，下方元素上移，自身元素不受影响；阅读全文

posted @ 2019-08-12 16:33 yangkangkang 阅读(241) 评论(0) 推荐(0) 编辑

块状元素和内联元素

摘要：块状元素常见元素：<h1>~<h6>,<p>,<div>,<ul>,<ol>,<li> 等等特点： 1）独占一行 2）高度、行高、外边距和内边距都可以单独设置 3）宽度默认是容器的100%； 4）可以容纳内联元素和其他的块级元素内联元素常见元素：<a>,<span>,<button> 等等阅读全文

posted @ 2019-08-08 15:14 yangkangkang 阅读(135) 评论(0) 推荐(0) 编辑

如何理解 HTML 语义化？

摘要：先看下面两段代码 html语义化代码： HTML语义化的好处？ 1.让人更容易读懂（增加代码可读性） 2.让搜索引擎更容易读懂（SEO）搜索引擎根据第一段代码分不清重点，机器只认识标签阅读全文

posted @ 2019-08-08 14:44 yangkangkang 阅读(500) 评论(0) 推荐(0) 编辑