課程
/前端開發(fā)
/HTML/CSS
/初識HTML(5)+CSS(3)-升級版
比如把文字在空間中居中
2017-01-11
源自:初識HTML(5)+CSS(3)-升級版 12-13
正在回答
居中,一般有兩種,內(nèi)容居中就用text-align:center;讓整個div居中,前提為這個div設(shè)置width和height值,利用margin:0 auto;來設(shè)置。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />?
<title>居中</title>
<style type="text/css">
.content{
width: 100px;
height: 100px;
margin: 0 auto;
}
</style>
</head>
<body>
<div class="content">I Love You</div>
</body>
</html>>
可以使用垂直居中
text-algin
內(nèi)容排版可以使用text-align樣式代碼,如下代碼
(1)可實現(xiàn)h1文本居中顯示。
h1{ ? ?text-align:center;}<h1>了不起的蓋茨比</h1>
(2)h1設(shè)置居左:
h1{ ? ?text-align:left;}<h1>了不起的蓋茨比</h1>
(3)h1設(shè)置居右:
h1{ ? ?text-align:right;}<h1>了不起的蓋茨比</h1>
qq_月下梭影_0 提問者
舉報
HTML(5)+CSS(3)基礎(chǔ)教程8小時帶領(lǐng)大家步步深入學(xué)習(xí)標(biāo)簽用法和意義
2 回答盒子模型內(nèi)容的理解
3 回答網(wǎng)頁排版是用到盒子模型排版嗎?
3 回答盒子模型內(nèi)容溢出
3 回答關(guān)于盒模型內(nèi)容居中顯示
8 回答關(guān)于盒模型內(nèi)容底部溢出不解!
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網(wǎng)安備11010802030151號
購課補(bǔ)貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動學(xué)習(xí)伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號
2017-02-20
居中,一般有兩種,內(nèi)容居中就用text-align:center;讓整個div居中,前提為這個div設(shè)置width和height值,利用margin:0 auto;來設(shè)置。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />?
<title>居中</title>
<style type="text/css">
.content{
width: 100px;
height: 100px;
margin: 0 auto;
}
</style>
</head>
<body>
<div class="content">I Love You</div>
</body>
</html>>
2017-02-13
可以使用垂直居中
2017-01-11
text-algin
2017-01-11
內(nèi)容排版可以使用text-align樣式代碼,如下代碼
(1)可實現(xiàn)h1文本居中顯示。
h1{
? ?text-align:center;
}
<h1>了不起的蓋茨比</h1>
(2)h1設(shè)置居左:
h1{
? ?text-align:left;
}
<h1>了不起的蓋茨比</h1>
(3)h1設(shè)置居右:
h1{
? ?text-align:right;
}
<h1>了不起的蓋茨比</h1>