在段落中浮动图像的最佳做法

时间:2014-01-10 18:09:44

标签: css html css-float

这是在段落文本中浮动图像的最佳做法吗?我想确保文本段落的顶部与图像的顶部对齐,并且图像周围有填充,以便文本不会。

查看我的http://jsfiddle.net/huskydawgs/vrLeg/

    <div style="float:right;padding:0 0 20px 30px">
    <img alt="Request White Paper" src="http://icons.iconarchive.com/icons/artbees/paradise-fruits/256/Pear-icon.png" />
</div>
<p><strong>Authors: </strong>Don Bankes and Jennifer Blakc<br />
    <strong>Publication Date: </strong>January 2014</p>

<p>The pear is any of several tree and shrub species of genus Pyrus /ˈpaɪrəs/, in the family Rosaceae. It is also the name of the pomaceous fruit of these trees. Several species of pear are valued for their edible fruit, while others are cultivated as ornamental trees. The genus Pyrus is classified in subtribe Pyrinae within tribe Pyreae.</p>
<p>The genus is thought to have originated in present-day western China in the foothills of the Tian Shan, a mountain range of Central Asia, and to have spread to the north and south along mountain chains, evolving into a diverse group of over 20 widely recognized primary species[citation needed]. The enormous number of varieties of the cultivated European pear (Pyrus communis subsp. communis), are without doubt derived from one or two wild subspecies (P. communis subsp. pyraster and P. communis subsp. caucasica), widely distributed throughout Europe, and sometimes forming part of the natural vegetation of the forests. Court accounts of Henry III of England record pears shipped from La Rochelle-Normande and presented to the King by the Sheriffs of the City of London. The French names of pears grown in English medieval gardens suggest that their reputation, at the least, was French; a favored variety in the accounts was named for Saint Rule or Regul', Bishop of Senli</p>

2 个答案:

答案 0 :(得分:1)

我会在样式表中创建一个图像浮点类,然后将该类应用于您想要向左或向右浮动的图像。

要使它与文本段落一致,您应该将该项目向左或向右浮动,并使图像html位于文本段落之前,而不是在作者/出版日期之前。

CSS:

   .alignright {
    float: right;
    margin: 0px 0px 20px 30px;
    }

HTML:

    <p><strong>Authors: </strong>Don Bankes and Jennifer Blakc<br />
    <strong>Publication Date: </strong>January 2014</p>

    <img alt="Request White Paper" src="http://icons.iconarchive.com/icons/artbees/paradise-fruits/256/Pear-icon.png" class="alignright" />
<p>The pear is any of several tree and shrub species of genus Pyrus /ˈpaɪrəs/, in the family Rosaceae. It is also the name of the pomaceous fruit of these trees. Several species of pear are valued for their edible fruit, while others are cultivated as ornamental trees. The genus Pyrus is classified in subtribe Pyrinae within tribe Pyreae.</p>
    <p>The genus is thought to have originated in present-day western China in the foothills of the Tian Shan, a mountain range of Central Asia, and to have spread to the north and south along mountain chains, evolving into a diverse group of over 20 widely recognized primary species[citation needed]. The enormous number of varieties of the cultivated European pear (Pyrus communis subsp. communis), are without doubt derived from one or two wild subspecies (P. communis subsp. pyraster and P. communis subsp. caucasica), widely distributed throughout Europe, and sometimes forming part of the natural vegetation of the forests. Court accounts of Henry III of England record pears shipped from La Rochelle-Normande and presented to the King by the Sheriffs of the City of London. The French names of pears grown in English medieval gardens suggest that their reputation, at the least, was French; a favored variety in the accounts was named for Saint Rule or Regul', Bishop of Senli</p>

答案 1 :(得分:0)

“最佳”最佳做法是遵循HTML文档中浮动的标准:

即来自this wiki on floatsthese specsw3c

与往常一样,你应该确保清除你的花车,以免给未来的开发人员带来麻烦。

相关问题