Gemeinschaft Lernen Tools-Bibliothek Freizeit
suchen
Deutsch
Heim > Web-Frontend > HTML-Tutorial > <a inline-block>和<img>在一行，为什么改变img的margin-top，a的位置也变了？_html/css_WEB-ITnose

<a inline-block>和<img>在一行，为什么改变img的margin-top，a的位置也变了？_html/css_WEB-ITnose

WBOY
Freigeben： 2016-06-21 09:04:07
Original
1164 Leute haben es durchsucht

.daohang a{	display:inline-block;	margin-top:6px;}/*为什么更改img的上边距时，链接a也会跟着下移？*/.daohang img{        width:21px;        height:21px;	margin-top:7px;}
Nach dem Login kopieren

<div class="daohang">		<a href="url>首页</a>		<img  src="../image/line.png"/ alt="<a inline-block>和<img>在一行，为什么改变img的margin-top，a的位置也变了？_html/css_WEB-ITnose" >
Nach dem Login kopieren


这个模型应该可以看做一个大的div里面包含了两个小的div吧，他们应该是相互独立的呀，为什么改变img的margin会使链接a也下移呢？
我试了试审查元素，发现a的外边距并没有顶格到div上，而img是有的，这又是为什么？


回复讨论(解决方案)

请将img放在a标签中。。。

你的HTML代码呢。。。。

HTML+CSS  怎么排版也是门学问的

HTML贴粗来  可以的话贴个图之类的

估計與垂直對齊有關…

inline-block影响的吧
解决这个，可以使用float代替display，再使用margin  互相不会有影响

Verwandte Etiketten：
&lt;a inline-block&gt;和&lt;img&gt;在一行，为什么改变img的margin-top，a的
Quelle：php.cn
Vorheriger Artikel：用什么布局来实现_html/css_WEB-ITnose Nächster Artikel：position：fixed对元素影响的疑问？_html/css_WEB-ITnose
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
Neueste Artikel des Autors
Aktuelle Ausgaben
function_exists() kann die benutzerdefinierte Funktion nicht ermitteln Funktionstest () {Verwendung der Verwendung durch -Durch -Durch -Durch -Durch -Durch -Durc...
Aus 2024-04-29 11:01:01
0
3
2191
So zeigen Sie die mobile Version von Google Chrome an Hallo Lehrer, wie kann ich Google Chrome in eine mobile Version umwandeln?
Aus 2024-04-23 00:22:19
0
11
2340
Das untergeordnete Fenster bedient das übergeordnete Fenster, aber die Ausgabe antwortet nicht. Die ersten beiden Sätze sind ausführbar, der letzte Satz jedoch nicht.
Aus 2024-04-19 15:37:47
0
1
1963
Im übergeordneten Fenster erfolgt keine Ausgabe document.onclick = function(){ window.opener.document.write('Ich bin die Ausgabe des unter...
Aus 2024-04-18 23:52:34
0
1
1850
Wo gibt es die Kursunterlagen zum CSS-Mindmapping? Kursunterlagen
Aus 2024-04-16 10:10:18
0
0
1908
verwandte Themen
Mehr>
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Verwandte Tutorials
Beliebte Empfehlungen
Aktuelle Kurse
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage