對齊圖片，旁邊<h>標籤

我開始學習HTML和CSS前幾天，現在有一個問題：對齊圖片，旁邊<h>標籤

#referenzen{ 
 
     width: 100%; 
 
     padding: 25px; 
 
    
 
    } 
 

 
    #referenzen h1, h2, h3, h4, h5, h6{ 
 
     margin-bottom: 0; 
 
    } 
 

 
    #referenzen p{ 
 
     padding-right: 25px; 
 
     font-size: 18px; 
 
    } 
 

 
    #referenzen img{ 
 
     height: 50px; 
 
     width: 50px; 
 
     float: left; 
 
    }

<div id="wrapper"> 
 
    <div id="referenzen"> 
 
     <img src="../Bilder/info.png"> 
 
     <h1>Unsere Firmengeschichte</h1> 
 
     <br> 
 
     <p>Die Firma Fair-Bau GmbH wurde im April 2010 gegründet und betätigt sich in den Sparten ausführende Baumeisterarbeiten, Vollwärmeschutzarbeiten, Verputzarbeiten sowie dem Handel mit Baustoffen. 
 
      Der Betrieb beschäftigt 15- 20 Mitarbeiter. \t </p> 
 
    </div>

我怎麼能直接將圖像分配給標籤它的直接旁邊呢？

上的網頁it's當前狀態：http://imgur.com/a/IprOF

提前感謝！

來源

2017-01-30 Arie

不涉及到你的問題，但是請注意，是不一樣的'#referenzen H1，H2，h3'和'#referenzen H1，H2 #referenzen，#referenzen h3'。 –

你能否更具體些？讓我們知道，如果你只是想移動圖像或其他東西。 –

-1

你可以只是margin-top: 15px的圖像。

#referenzen { 
 
    width: 100%; 
 
    padding: 25px; 
 
} 
 
#referenzen h1, 
 
h2, 
 
h3, 
 
h4, 
 
h5, 
 
h6 { 
 
    margin-bottom: 0; 
 
} 
 
#referenzen p { 
 
    padding-right: 25px; 
 
    font-size: 18px; 
 
} 
 
#referenzen img { 
 
    height: 50px; 
 
    width: 50px; 
 
    float: left; 
 
    margin-top: 15px; 
 
}

<div id="wrapper"> 
 
    <div id="referenzen"> 
 
    <img src="http://vignette2.wikia.nocookie.net/dccu/images/b/bc/Icon-Wikipedia.png/revision/latest?cb=20160324075444"> 
 
    <h1>Unsere Firmengeschichte</h1> 
 
    <br> 
 
    <p>Die Firma Fair-Bau GmbH wurde im April 2010 gegründet und betätigt sich in den Sparten ausführende Baumeisterarbeiten, Vollwärmeschutzarbeiten, Verputzarbeiten sowie dem Handel mit Baustoffen. Der Betrieb beschäftigt 15- 20 Mitarbeiter.</p> 
 
    </div>

來源

2017-01-30 12:28:17

有兩種方法，我會做到這一點：

在HTML：你可以插入<img> - 標籤裏面你<h1></h1> -tag
在CSS：您可以設置h1和img到display: inline-block

我更喜歡第一個。

EDIT爲了更好的理解：

<h1>...<h6>具有默認的blockdisplay這意味着它們共坐父容器的100％的寬度的標籤。因此，將其更改爲內聯塊會破壞100％寬度並將其縮小爲設置的寬度值，或者如果未將其設置爲所包含元素的大小。

來源

2017-01-30 12:22:50 FioleNana

對齊圖片，旁邊<h>標籤

回答

相關問題