1.解释一下display的几个常用的属性值，inline ， block， inline-block inline（行内元素）: 使元素变成行内元素，拥有行内元素的特性，即可以与其他行内元素共享一行，不会独占一行. 不能更改元素的height，width的值，大小由内容撑开. 可以使用paddin ...
分类：
Web程序 时间：
2020-01-02 22:12:05
阅读次数：
71
text-align(文本对齐样式):可控制字体与行内元素如span 与 img left right center justify(两端对齐) 常见编程问题：想让文字上下左右居中对齐： text-align:center 配合line-height 想让图片上下左右居中对齐: text-align ...
分类：
其他好文 时间：
2020-01-01 16:35:42
阅读次数：
62
[toc] 网格布局 grid(1) 实现方式 也可成为 行内元素 tip:设为网格布局以后，容器内的子元素的 float 、 display:inline block/table cell , vertical align 和 column 等 各项设置属性都将失效 对容器设置的属性 行高与列宽的 ...
分类：
其他好文 时间：
2019-12-28 12:51:54
阅读次数：
91
常见布局实现： 作者：Sweet_KK 链接：https://juejin.im/post/5aa252ac518825558001d5de 来源：掘金 一、水平居中 文本/行内元素/行内块元素居中 ==text align== 只控制行内内容（文字、行内元素、行内块元素）如何相对于他的块父元素对齐 ...
分类：
其他好文 时间：
2019-12-27 21:53:44
阅读次数：
102
Flex是Flexible Box的缩写，意为”弹性布局”，用来为盒状模型提供最大的灵活性。 任何一个容器都可以指定为Flex布局。 .box{ display: flex; } 行内元素也可以使用Flex布局。 .box{ display: inline-flex; } 容器默认存在两根轴：水平的 ...
分类：
其他好文 时间：
2019-12-27 09:36:16
阅读次数：
96
水平居中 1.行内元素水平居中，外面的父级块元素设置样式text align:center; 效果图如下： 2.块级元素的水平居中 方法一：设置左右两边的margin为auto即可 效果图如下： 方法二:css3新属性fit content意思是宽度缩小到和内容一样宽配合margin:auto; 效 ...
分类：
Web程序 时间：
2019-12-25 13:16:53
阅读次数：
100
div水平居中 1.行内元素 .parent{ text align: center } 2.块级元素 .son{ margin: 0 auto ; } 3.flex布局 .parent{ display: flex; justify content: center } 4.绝对定位 定宽 .son ...
分类：
Web程序 时间：
2019-12-23 16:38:26
阅读次数：
91
共有三大体系：常规流（normal flow） 浮动（float） 绝对定位（absolute position） 常规流：在没有css的干预下，块级元素独占一行，宽高可设；行内元素并排显示，宽高自动。 当元素浮动后，脱离文档流。因为子级元素浮动后导致父级高度坍塌。 浮动：1.左浮动的元素向上向左排 ...
分类：
其他好文 时间：
2019-12-21 20:56:51
阅读次数：
70
盒模型（内容（content）,内边距（padding）,边框（border）,外边距（margin）） 这里做个比喻：content:比喻在网上买了几个鸡蛋； padding：比喻快递员包装鸡蛋用的防撞纸的距离，把鸡蛋牢牢的包裹起来，以免碰撞； border:外面使用包装箱的厚度； margin: ...
分类：
其他好文 时间：
2019-12-21 19:03:07
阅读次数：
78
