使用css對齊中心的文本

我使用下面的代碼來獲取簡單的圖片庫（實際代碼在http://w3schools.com中找到，它可以很好地工作）。編輯CSS後，文本的對齊方式已更改。我想將文本對齊中心。任何人都知道答案請幫助我。使用css對齊中心的文本

我的HTML代碼：

<html> 
<body> 
<div id="d"> 
<div class="img"> 
<a target="_blank" href="klematis_big.htm"> 
<img src="a.jpg"> 
</a> 
<div class="desc"> 
Add a description of the image here </div> 
</div> 
<div class="img"> 
<a target="_blank" href="klematis2_big.htm"> 
<img src="a.jpg"> 
</a> 
<div class="desc"> 
<p> 
Add a description of the image here</p> 
</div> 
</div> 
<div class="img"> 
<a target="_blank" href="klematis3_big.htm"> 
<img src="a.jpg"> 
</a> 
<div class="desc"> 
Add a description of the image here</div> 
</div> 
<div class="img"> 
<a target="_blank" href="klematis4_big.htm"> 
<img src="a.jpg"> 
</a> 
<div class="desc"> 
<p> 
Add a description of the image here</P> 
</div> 
</div> 
<div class="img"> 
<a target="_blank" href="klematis_big.htm"> 
<img src="a.jpg"> 
</a> 
<div class="desc"> 
Add a description of the image here</div> 
</div> 
<div class="img"> 
<a target="_blank" href="klematis2_big.htm"> 
<img src="a.jpg"> 
</a> 
<div class="desc"> 
Add a description of the image here</div> 
</div> 
</div> 
</body> 
</html>

我的CSS代碼：

#d 
{ 
width : 660; 
border:1px; 
} 
.img 
{ 
margin:3px; 
border:1px solid #0000ff; 
height:200; 
width:200; 
float:left; 
text-align:center; 
} 
.img img 
{ 
display:inline; 
margin:3px; 
border:1px solid #ffffff; 
width:100; 
height : auto; 
} 
.img a:hover img 
{ 
border:2px solid #0000ff; 
} 
.desc 
{ 
text-align:center; 
font-weight:normal; 
width:120px; 
margin:2px; 
}

截圖： enter image description here

來源

2013-02-09 Rahul R

刪除div的寬度。

.desc { 
    text-align: center; 
    font-weight: normal; 
    margin: 2px; 
}

並且還將其更改爲text-align。屬性align不存在。

來源

2013-02-09 09:42:58

偉大的答案謝謝 – 2013-02-09 09:50:42

更改CSS來

.desc 
{ 
text-align:center; 
font-weight:normal; 
width:120px; 
margin:2px; 
}

變化align:center;到text-align:center;

來源

2013-02-09 09:34:35

它仍然無法正常工作，請檢查 – 2013-02-09 09:37:19

請檢查您的CSS，在.img中添加'px'值到高度和寬度。例如.img {height：200px; width：200px;} – 2013-02-09 09:43:08

試試這個：

.desc{ 
margin: 0 auto; 
}

來源

2013-02-09 09:42:41 HamZa

是的它的作品 – 2013-02-09 09:44:46

必須修改margin屬性的值：

.desc 
{ 
text-align:center; 
font-weight:normal; 
width:120px; 
margin:2px auto; 
}

還井號是在這部分丟失：

<style> 

d 
{ 
width : 660; 
border:1px; 
}

它必須修改如下：

<style> 

#d { 
    width : 660; 
    border:1px; 
}

來源

2013-02-09 09:55:07 Olexiy

謝謝.. rabe的答案解決了我的問題 – 2013-02-09 09:57:24

使用css對齊中心的文本

回答

相關問題