用文本居中img

问题描述

我正试图将Yahoo Join Groups图像的中心放在下面的文字

it。在文档中使用标记，我只会使用< center>标签。但我正在使用

css。我怎么能这样做？


<！ - 添加加入雅虎群组的链接 - >

< a href =" http： //groups.yahoo.com/group/floridahunters/join">

< img class =" yahooGrp"

src =" http：// us .i1.yimg.com / us.yimg.com / i / yg / img / i / us / ui / join.gif"

alt ="" />加入FloridaHunters< / a>


可以在以下网址看到：




TIA！

解决方案

< h3>杂志< / h3>

< ul>

< li>< a href =" http：//www.floridawildlifemagazine.com/"> Florida

Wildlife< / a>< / li>

< li>< a href =" http：//www.woodsnwater.net/"> Woods &放大器;放大器;水< / a>

< / li>

< / ul>


<！ - 添加链接加入雅虎群组 - >


< div style =''text-align：center;''>


< ; a href =" http：//groups.yahoo.com/group/floridahunters/join">

< img class =" yahooGrp"

src =" http://us.i1.yimg.com/us.yimg.com/i/yg/img/i/us/ui/join.gif"

alt ="" ; />加入FloridaHunters< / a>


< / div>


< / div>

<！ - 结束导航 - >

-

Evertjan。

荷兰。

（在我的电子邮件地址中用点替换所有十字架）

< h3>杂志< / h3>
< ul>
< li>< a
href =" http：//www.floridawildlifemagazine.com/">佛罗里达州
野生动物< / a>< ; /立GT; < li>< a
href =" http：//www.woodsnwater.net/"> Woods& amp;水和LT; / A> < / li>
< / ul>

<！ - 添加加入Yahoo Groups的链接 - >

< div style = ''text-align：center;''>

< a href =" http：//groups.yahoo.com/group/floridahunters/join">
< ; img class =" yahooGrp"
src =" http://us.i1.yimg.com/us.yimg.com/i/yg/img/i/us/ui/join.gif"
alt ="" />加入FloridaHunters< / a>

< / div>

< / div>
<！ - 结束导航 - >

Arggg！那太简单了。我觉得这会更难。

谢谢！

我只提到我使用的方法因为我认为它是一个黑客而且我会对b $ b感兴趣听到更优雅的解决方案。


div.image-container {width：XXXpx; }

＃image-name {width：XXXpx;身高：XXXpx; }

div.image-container {float：left;}

< div class =" image-container">

< img id =" image-name" SRC =" NNN.png" alt =" [image identifier]" />

< div>

< span>标题文字< / span>

< / div>

< / div>


-


Haines Brown

KB1GRM

I''m trying to center the Yahoo Join Groups image with the text below
it. Using markup in the doc, I''d just use <center> tags. But I''m using
css. How can I do this?

<!-- Add link to join Yahoo Groups -->
<a href="http://groups.yahoo.com/group/floridahunters/join">
<img class="yahooGrp"
src="http://us.i1.yimg.com/us.yimg.com/i/yg/img/i/us/ui/join.gif"
alt="" />Join FloridaHunters</a>

Can be seen at:

http://www.unitedhunters.org/index.html

TIA!

解决方案

<h3>Magazines</h3>
<ul>
<li><a href="http://www.floridawildlifemagazine.com/">Florida
Wildlife</a></li>
<li><a href="http://www.woodsnwater.net/">Woods &amp; Water</a>
</li>
</ul>

<!-- Add link to join Yahoo Groups -->

<div style=''text-align:center;''>

<a href="http://groups.yahoo.com/group/floridahunters/join">
<img class="yahooGrp"
src="http://us.i1.yimg.com/us.yimg.com/i/yg/img/i/us/ui/join.gif"
alt="" />Join FloridaHunters</a>

</div>

</div>
<!-- End Navigation -->
--
Evertjan.
The Netherlands.
(Replace all crosses with dots in my emailaddress)

<h3>Magazines</h3>
<ul>
<li><a
href="http://www.floridawildlifemagazine.com/">Florida
Wildlife</a></li> <li><a
href="http://www.woodsnwater.net/">Woods &amp; Water</a> </li>
</ul>

<!-- Add link to join Yahoo Groups -->

<div style=''text-align:center;''>

<a href="http://groups.yahoo.com/group/floridahunters/join">
<img class="yahooGrp"
src="http://us.i1.yimg.com/us.yimg.com/i/yg/img/i/us/ui/join.gif"
alt="" />Join FloridaHunters</a>

</div>

</div>
<!-- End Navigation -->

Arggg! That was too easy. I was thinking it would be much harder.
Thanks!

I only mention the method I use because I consider it a hack and I''d
be interested in hearing of a more elegant solution.

div.image-container { width: XXXpx; }
#image-name { width: XXXpx; height: XXXpx; }
div.image-container {float: left;}

<div class="image-container">
<img id="image-name" src="NNN.png" alt="[image identifier]" />
<div>
<span>Caption text</span>
</div>
</div>

--

Haines Brown
KB1GRM

这篇关于用文本居中img的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！