1、vertical-align属性 （1）使用场景 经常用于设置图片或者表单和文字的垂直对齐，用于设置一个元素的垂直对齐方式，但是他只针对于行内元素或行内块元素 （2）属性值 baseline：默认值，元素放置在父元素的基线上 top：把元素的顶端与行中最高元素的顶端对齐 middle：把此元素放 ...
分类：
Web程序 时间：
2020-07-06 21:33:53
阅读次数：
98
目录 水平居中 行内元素 块级元素 方案一：(分宽度定不定两种情况) 方案二：使用定位属性 方案三：使用flexbox布局实现（宽度定不定都可以） 垂直居中 单行的行内元素 多行的行内元素 块级元素 水平垂直居中 已知高度和宽度的元素 未知高度和宽度的元素 方案一：使用定位属性 方案二：使用flex ...
分类：
Web程序 时间：
2020-07-05 23:12:37
阅读次数：
99
浮动 元素的浮动是指设置了浮动属性的元素会脱离标准普通 流的控制，移动到其父元素中指定位置的过程。 语法: float : left right none(默认) 注意: 1. 浮动的元素要有父元素 2. 浮动后的元素类似元素行内块元素,即使行内元 素浮动后也可以设置宽高.(类似不代表是,浮动后的盒 ...
分类：
其他好文 时间：
2020-07-05 20:55:51
阅读次数：
105
复盘鼎甲科技2020web开发工程师-笔试题（校招） 本试卷以W3C规范为准，JavaScript使用ES5标准，除特别说明外，不考虑各个浏览器之间差异。 一、多项选择题 以下标签是行内元素(inline)的是【多选题】【A C D E】 A. <img> B. <li> C. <label> D. ...
分类：
Web程序 时间：
2020-07-03 19:46:12
阅读次数：
83
场景 由于行内元素默认vertical-align按照基线(base-line)对齐，而父元素的border-bottom对应着行内元素的底线(bottom)，所以默认情况下图片会与父元素产生底部间隙。 去除间隙 vertical-align按照bottom对齐 img { vertical-ali ...
分类：
Web程序 时间：
2020-07-03 15:44:50
阅读次数：
87
浮动 元素的浮动是指设置了浮动属性的元素会脱离标准普通 流的控制，移动到其父元素中指定位置的过程。 语法: float . left . right . none(默认) 注意： 1. 浮动的元素要有父元素 2. 浮动后的元素类似元素行内块元素,如果没有设置宽高,它的宽等同于内容的宽高.即使行内元素 ...
分类：
Web程序 时间：
2020-07-02 21:35:35
阅读次数：
76
行内元素 <img/>、<strong></strong>、<em></em>、<hr/>、<br/> <a></a>、<span></span>、<input>、<select></select> 块级元素 <h1></h1> ~ <h6></h6>、<p></p>、列表、表格{div 、ul o ...
分类：
其他好文 时间：
2020-07-01 23:42:19
阅读次数：
56
元素有行内元素(inline)、块级元素(block)以及行内块元素(inline-block)之分，对应地它们之间的盒模型也会有不同。 1. 行内元素(inline) 通过display: inline可将元素声明为行内元素，顾名思义指在行里面的元素，因此没有换行的行为。 1.1 宽度和高度 行内 ...
分类：
Web程序 时间：
2020-06-29 21:27:16
阅读次数：
101
1：找个容器： .container { display: flex | inline-flex; //可以有两种取值：块元素，行内元素 } 2：容器的设置： .container { flex-direction: row | row-reverse | column | column-rever ...
分类：
其他好文 时间：
2020-06-29 13:17:23
阅读次数：
63
.div1 { display: inline-block; height: 300px; width: 500px; margin:30px; text-align: center border: 2px solid red; } .div2 { display: inline-block; he ...
分类：
其他好文 时间：
2020-06-27 00:01:19
阅读次数：
86
