如何在div内的一行中用p,h3显示img?

时间:2011-02-16 11:45:41

标签: css

嘿,我需要在div的左侧显示图像,在img旁边的div的右侧显示h3和p。谁能告诉我css和html的答案?感谢

3 个答案:

答案 0 :(得分:5)

喜欢这个吗?

Live Demo

与目前为止发布的其他答案相比,这具有优势(取决于您想要的) - 如果文本内容的高度大于图像,则文本将保持齐平(赢得'缠绕图像。)

<强> CSS:

#content {
    margin-left: 210px
}
#theDiv img {
    float: left
}

<强> HTML:

<div id="theDiv">

    <img src="http://dummyimage.com/200x300/f0f/fff" />

    <div id="content">
        <h3>how to display img with p, h3 in one line inside the div?</h3>
        <p>Hey, i need to display the image on the left side of the div, h3 and p on the rifgt side of the div next to img. Can anyone tell me the answer in css and html? Thanks</p>
        <p>Hey, i need to display the image on the left side of the div, h3 and p on the rifgt side of the div next to img. Can anyone tell me the answer in css and html? Thanks</p>
        <p>Hey, i need to display the image on the left side of the div, h3 and p on the rifgt side of the div next to img. Can anyone tell me the answer in css and html? Thanks</p>
        <p>Hey, i need to display the image on the left side of the div, h3 and p on the rifgt side of the div next to img. Can anyone tell me the answer in css and html? Thanks</p>
        <p>Hey, i need to display the image on the left side of the div, h3 and p on the rifgt side of the div next to img. Can anyone tell me the answer in css and html? Thanks</p>
        <p>Hey, i need to display the image on the left side of the div, h3 and p on the rifgt side of the div next to img. Can anyone tell me the answer in css and html? Thanks</p>
    </div>

</div>

答案 1 :(得分:1)

只需float图片left

img {
    float: left;
}

http://jsfiddle.net/lukemartin/EZ4pT/

答案 2 :(得分:1)

让您的图片浮动:

<div>
    <img src="http://www.google.com/intl/en_com/images/srpr/logo1w.png" 
         style="float: left" />
    <h3>
        Nemo nemo et habitus) ad oritur ab disputatio cuius ab.</h3>
    <p>
        Itaque verae amicitiae difficillime reperiuntur in iis qui in honoribus reque publica
        versantur; ubi enim istum invenias qui honorem amici anteponat suo? Quid? Haec ut
        omittam, quam graves, quam difficiles plerisque videntur calamitatum societates!
        Ad quas non est facile inventu qui descendant. Quamquam Ennius recte.</p>
    <p>
        Et quia Montius inter dilancinantium manus spiritum efflaturus Epigonum et Eusebium
        nec professionem nec dignitatem ostendens aliquotiens increpabat, qui sint hi magna
        quaerebatur industria, et nequid intepesceret, Epigonus e Lycia philosophus ducitur
        et Eusebius ab Emissa Pittacas cognomento, concitatus orator, cum quaestor non hos
        sed tribunos fabricarum insimulasset promittentes armorum si novas res agitari conperissent.</p>
    <p>
        Nec piget dicere avide magis hanc insulam populum Romanum invasisse quam iuste.
        Ptolomaeo enim rege foederato nobis et socio ob aerarii nostri angustias iusso sine
        ulla culpa proscribi ideoque hausto veneno voluntaria morte deleto et tributaria
        facta est et velut hostiles eius exuviae classi inpositae in urbem advectae sunt
        per Catonem, nunc repetetur ordo gestorum.</p>
</div>