如何使用css让img垂直居中(flex方法)?

html-css013

如何使用css让img垂直居中(flex方法)?,第1张

首先给图片添加一个div,设置其宽高及基本属性,其次把div中的display元素设置成flex,最后给img

添加align-items:center属性,代码如下:

body{

background:#000

}

.xxx{

width: 300px

height: 250px

background:#deeppink

display: flex

align-items: center

}

.xxx img{

width: 100px

height: 100px

align-items: center

}

这个是我请教的我的传智播客老师,分享给你。

定位的语法:element = driver.find_element_by_css_selector(css_selector)

1. id选择器 :#id

2. class选择器: .class

3. 元素选择器:输入元素element

4. 属性选择器 element[attribute=value]

5. 层级选择器:element1>element2

如果想了解更多可以来传智播客学习。

CSS初始化的代码一般要控制常见的页面元素比如body div table等的大小,位置和背景色等夜页面初始加载的样式:

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td { margin:0padding:0}

body { font-size:12pxcolor:#666font-family:Verdana, Microsoft YaHei, Simsunbackground:#fffline-height:24px}

fieldset, img { border:0}

ol, ul { list-style:none}

h1, h2, h3, h4, h5, h6{ font-size:100%}

em { font-style:normal}

input, button, select, textarea { outline:none}

textarea { resize:none} //禁用了文本的拖拉,尤其在谷歌下

p{ text-align:justifytext-justify:distribute} //为了使文本段落左右两边对齐