Heim > Web-Frontend > HTML-Tutorial > dl dt dd怎么定位?_html/css_WEB-ITnose

dl dt dd怎么定位?_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 12:13:41
Original
1307 Leute haben es durchsucht

想实现一个图片,下面一个标题的list,不知道标题dt怎么定位在图片dd下?代码如下

nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



无标题文档






dl dt dd怎么定位?_html/css_WEB-ITnose

1



dl dt dd怎么定位?_html/css_WEB-ITnose

2



dl dt dd怎么定位?_html/css_WEB-ITnose

3







回复讨论(解决方案)

模型  游戏  新闻

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档 </title> <style type="text/css"> .list{ width:400px; height:70px; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto;text-align:center; } .list dl{     float:left; 	margin-left:10px;} .list dd{ width:auto;	margin:0px;} .list dt{ margin:0px;} </style> </head> <body> <div class="list"> <dl> <dd> <img  src="http://avatar.profile.csdn.net/D/B/D/2_zh050317.jpg" / alt="dl dt dd怎么定位?_html/css_WEB-ITnose" > </dd> <dt>1 </dt> </dl> <dl> <dd> <img  src="http://avatar.profile.csdn.net/D/B/D/2_zh050317.jpg" / alt="dl dt dd怎么定位?_html/css_WEB-ITnose" > </dd> <dt>2 </dt> </dl> <dl> <dd> <img  src="http://avatar.profile.csdn.net/D/B/D/2_zh050317.jpg" / alt="dl dt dd怎么定位?_html/css_WEB-ITnose" > </dd> <dt>3 </dt> </dl> </div> </body> </html> 
Nach dem Login kopieren

怎么会用这么奇怪的方法?
之前一直以为dl dt dd是顺序的,不能调换次序。长见识了

2楼的代码简化一下:
margin-top: 0px; 
margin-right: auto; 
margin-bottom: 0px; 
margin-left: auto;
直接写成:margin:0px auto;就行了

这样也行

行是行  但是你不觉得这样是浪费时间么。  简便点,快一点。

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage