在我們在開發(fā)的時候難免會遇到各種各樣的問題，那么今天我們來看看在html中怎么設置居中這個問題，以下是我為大家找到的居中的方法和設置的一些方法，快來看看吧！
方法一：text-align：center；用法：
首先我們創(chuàng)建一個文件后呢，輸入一個 ?div? 標簽和 ?span? 標簽，然后在各自的標簽中加入一個類選擇器，在使用內(nèi)聯(lián)式書寫我們的 CSS 樣式，截圖代碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>居中設置方法</title>
<style>
.center-box{
text-align: center;
}
.baincheng-sp{
display: inline-block;
width: 500px;
}
</style>
</head>
<body>
<div class="center-box">
<span class="baincheng-sp">
W3cschool，編程獅在線即可免費學習。
</span>
</div>
</body>
</html>
在這個代碼和截圖中我們就可以清楚地看到字體居中了，如果沒有添加 CSS樣式的話，那么字體一般是默認靠左的。
方法二：margin: 0 auto;用法：
這個方法在我們使用的時候是不可以使用其他的定位方式例如：相對定位或者獨特定位。對于這些定位不了解的小伙伴可以在w3cschool中進行一個系統(tǒng)的學習和了解。而且這個方法也要求內(nèi)部的元素是要塊級元素，接下來我們來看下代碼和截圖吧！如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>居中設置方法</title>
<style>
.center-box{
text-align: center;
}
.baincheng-sp{
display: block; margin: 0 auto;
}
</style>
</head>
<body>
<div class="center-box" >
<span class="baincheng-sp">
W3cschool，編程獅在線即可免費學習。
</span>
</div>
</body>
</html>
我們依舊是先看我們的代碼和運行的截圖，都可以體現(xiàn)出來文字已經(jīng)居中了。
小結(jié)：
以上就是今天的一個有關于在html中怎么設置居中的方法的分享，當然如果你有更好的方法也可以分享給小編大家一起學習一下噢！這里小編也為大家?guī)硪粋€免費的HTML基礎入門的一個學習平臺，大家可以在里面觀看免費視頻學習噢！
