码迷,mamicode.com
首页 > 其他好文 > 详细

第十八节:绝对居中

时间:2020-01-04 20:43:21      阅读:99      评论:0      收藏:0      [点我收藏+]

标签:问题:   lock   ica   nbsp   content   center   文字   图片   isp   

常见编程问题:想让文字上下左右居中对齐:  text-align:center 配合line-height (单纯的文字 或者在行内 行内块的文字 可以给外级盒子line-height)

                        想让图片上下左右居中对齐:     text-align:center 配合vertical-align:middle(单纯的图片或在行内 行内块的图片)

                       想让图片上下左右居中对齐:   如果文字 图片包裹在一个身位子级的块级盒子内:利用绝对定位或者伪元素。

               利用伪元素::before(display:inline-block content:""  vertical-align:middle  width:0 height:100% )技术图片

                                              或者:height:50%,不给vertical-align:middle 

                                                        height:100%就要vertical-align:middle

                                                                   

                      绝对定位的居中:想让块级绝对居中:1利用position(定位)

                                                  绝对居中:第一种:(推荐)技术图片

                                                第二种(在不知宽高的情况下绝对居中):技术图片

 

                                    

第十八节:绝对居中

标签:问题:   lock   ica   nbsp   content   center   文字   图片   isp   

原文地址:https://www.cnblogs.com/yzdwd/p/12150166.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!