為什么80%的碼農(nóng)都做不了架構(gòu)師？>>> ??

行內(nèi)元素?還是?塊狀元素?，塊狀元素里面又分為定寬塊狀元素，以及不定寬塊狀元素

一、左右居中

1.行內(nèi)元素：

常用的inline元素有：

<a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code>

（1）給父元素設(shè)置

text-align:center?

2.塊狀元素：

常用的塊狀元素有，

<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>

? ? （1）定寬塊狀元素（width值或百分比已經(jīng)固定的元素）

? ? ? ? ①通過(guò)設(shè)置“左右margin”值為“auto”來(lái)實(shí)現(xiàn)居中的。

width:200px;margin:20px auto;

? ? （2）不定寬元素（width值且百分比沒(méi)有固定）

①加入?table?標(biāo)簽

②設(shè)置?display: inline?方法：與第一種類似，顯示類型設(shè)為?行內(nèi)元素，進(jìn)行不定寬元素的屬性設(shè)置

③設(shè)置?position:relative?和 left:50%：利用?相對(duì)定位?的方式，將元素向左偏移?50%?，即達(dá)到居中的目的

二、垂直居中

1.父元素高度確定的單行文本：

height:100px;line-height:100px;

2.父元素高度確定的多行文本：

（1）通過(guò)table屬性設(shè)置（tr、td、etc）

vertical-align：middle

（2）或者

display:table-cell;

?

轉(zhuǎn)載于:https://my.oschina.net/lafter/blog/1546717

創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來(lái)咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)

總結(jié)

以上是生活随笔為你收集整理的css文本居中的几种方式的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。