字幕图像 [英] captioning images
问题描述
我想要一个标题。在一个图像下插入两个流程
的文本。
我在想这样的事情：
（为了便于阅读，内联显示的样式，它们将被定义为类）
< div style =" float：left; padding：10px">< img src =" some_image.jpg">< div> my
caption / credit< / div>< / div>
< p>足够的内容流过图像....< / p>
也许图像容器应该设置边距而不是填充，
但是在像NS4这样破旧的浏览器中，填充不会破坏。
似乎应该有更好的方法来做到这一点。这是基本的
的东西！
将图像（和标题）插入段落流程怎么样？
Aren''t阻止段落中不允许的级别元素？
对< object data =" some_image_path"
的支持级别是什么类型= QUOT;图像/ JPG"> ？ （或是那个jpeg）。我的IE5（win 98）忽略了图像和
我的Opera 7和NS7.1都忽略了对象后面的任何文字。 Haven'n
检查Mac。但这似乎并不正确。我在这里使用了这个例子：
< http://www.w3.org/TR/html4/struct/objects.html>
And，不，我不想添加标题和photoshop一起！
我不太确定在哪里发布这个，我希望3组都不会过度杀！
Jeff
I''d like to place a "caption" under an image and insert both into the flow
of text.
I''m thinking of something like this:
(Styles shown inline for readability, they would be defined as classes)
<div style="float: left; padding: 10px"><img src="some_image.jpg"><div>my
caption/credit</div></div>
<p> enough content to flow around the image....</p>
Perhaps the image container should have a margin set rather than padding,
but padding doesn''t break badly in old broken browsers like NS4.
Seems like there should be a better way to do this. This is such basic
stuff!
What about inserting the image (and caption) into the flow of the paragraph?
Aren''t block level elements not allowed in paragraphs?
What''s the level of support for <object data="some_image_path"
type="image/jpg"> ? (or is that jpeg). My IE5 (win 98) ignores the image and
my Opera 7 and NS7.1 both ignore any text following the object. Haven''t
checked Mac. But that doesn''t seem right. I used the example here:
<http://www.w3.org/TR/html4/struct/objects.html>
And, no, I don''t want to add the "caption" with photoshop!
I wasn''t quite sure where to post this, I hope 3 groups isn''t overkill!
Jeff
推荐答案
Quoth the raven名为Jeff Thies：
Quoth the raven named Jeff Thies:
我想放置一个字幕"在一个图像下插入文本的流程。
我正在考虑这样的事情：
（为了便于阅读，内联显示的样式，他们将被定义为类）
< div style =" float：left; padding：10px">< img src =" some_image.jpg">< div> my
caption / credit< / div>< / div>
< p>足够的内容可以在图像周围流动....< / p>
这是我用的东西。
..imgleft，.imgright {
float：right ;
字体大小：90％;
字体样式：斜体;
填充：1em;
位置：相对;
text-align：center;
}
..imgleft {
float：left ;
}
..imgright {
浮动：正确;
}
< p> Blah blah blah blah blah blah blah blah blah blah blah blah blah
< span class =" imgright">
< img src =" ../pathto/image.jpg" alt ="适当的文字 width =" nnn"
height =" nnn" />< br>这是标题
< / span>
blah blah blah blah blah blah blah blah blah blah blah blah< / p>
< snip>
我不太确定在哪里发布这个，我希望3组不是过度杀！
I''d like to place a "caption" under an image and insert both into the flow
of text.
I''m thinking of something like this:
(Styles shown inline for readability, they would be defined as classes)
<div style="float: left; padding: 10px"><img src="some_image.jpg"><div>my
caption/credit</div></div>
<p> enough content to flow around the image....</p>
Here''s what I use.
..imgleft, .imgright {
float: right;
font-size: 90%;
font-style: italic;
padding: 1em;
position: relative;
text-align: center;
}
..imgleft {
float: left;
}
..imgright {
float: right;
}
<p>Blah blah blah blah blah blah blah blah blah blah blah
<span class="imgright">
<img src="../pathto/image.jpg" alt="Appropriate text" width="nnn"
height="nnn" /><br>This is Caption
</span>
blah blah blah blah blah blah blah blah blah blah </p>
<snip>
I wasn''t quite sure where to post this, I hope 3 groups isn''t overkill!
我想样式表组已经足够了。
-
-bts
-这个空间故意留空。
The stylesheet group would have been enough, I suppose.
--
-bts
-This space intentionally left blank.
>
我想放置一个 ;字幕"在一个图像下，并插入
文本流。
I''d like to place a "caption" under an image and insert both into the flow of text.
< snip>
这是我使用的。
.imgleft ，.imgright {
float：right;
font-size：90％;
font-style：italic;
padding：1em;
position：relative;
这很简单！为什么这个职位：亲戚？
杰夫
text-align：center;
}
.imgleft {
float：left;
}
。imgright {
float：right;
}
< p> Blah blah blah blah blah blah blah blah blah blah blah blah
< span class =" imgright">
< img src =" ../ pathto / image.jpg" alt ="适当的文字 width =" nnn"
height =" nnn" />< br>这是标题
< / span>
blah blah blah blah blah blah blah blah blah blah blah< / p>
< snip>
<snip>
Here''s what I use.
.imgleft, .imgright {
float: right;
font-size: 90%;
font-style: italic;
padding: 1em;
position: relative;
Well that was easy enough! Why the position: relative?
Jeff
text-align: center;
}
.imgleft {
float: left;
}
.imgright {
float: right;
}
<p>Blah blah blah blah blah blah blah blah blah blah blah
<span class="imgright">
<img src="../pathto/image.jpg" alt="Appropriate text" width="nnn"
height="nnn" /><br>This is Caption
</span>
blah blah blah blah blah blah blah blah blah blah </p>
<snip>
我不太确定在哪里发布这个，我希望3组不是矫枉过正！
I wasn''t quite sure where to post this, I hope 3 groups isn''t overkill!
样式表组会已经足够，我想。
-
-bts
- 这个空间故意留空。
The stylesheet group would have been enough, I suppose.
--
-bts
-This space intentionally left blank.
" Jeff Thies" <无**** @ nospam.net>在消息中写道
新闻：XU ***************** @ newsread1.news.atl.earthl ink.net ...
|我想要一个标题。在图像下插入
到流程中
|文本。
|
|我在考虑这样的事情：
|
| （内联样式为可读性，它们定义为
类）
|
| < div style =" float：left;填充：10px">< img
src =" some_image.jpg">< div> my
|标题/信用< / div>< / div>
| < p为H.足够的内容可以在图像周围流动....< / p>
|
|也许图像容器应该设置边距而不是填充，
|但是在旧的破碎的浏览器中填充并没有破坏，例如
NS4。
|
|似乎应该有更好的方法来做到这一点。这是
这样基本的
|东西！
|
|将图像（和标题）插入
段的流程怎么样？
| Aren''t阻止段落中不允许的级别元素？
|
|对< object data =" some_image_path"
|的支持程度是多少？类型= QUOT;图像/ JPG"> ？ （或是那个jpeg）。我的IE5（win 98）忽略了
的图像和
|我的Opera 7和NS7.1都忽略了对象之后的任何文字。
Haven''t
|检查了Mac。但这似乎并不正确。我在这里使用了这个例子
：
| < http://www.w3.org/TR/html4/struct/objects.html>
|
|并且，不，我不想添加标题。与photoshop！
|
|我不太确定在哪里发布这个，我希望3组不是
矫枉过正！
|
|杰夫
|
杰夫，
为什么不给你一个< br>图像和标题之间和
摆脱标题div？它对我的样本起作用了。
它还验证严格的4.01并且在我的浏览器中看起来没问题（IE6，
NN7.1，Moz1.4，& Opera 7.11）。
http：// webpages.charter.net/rwtest/s...ge_caption.htm
hth
-
Chet
ng******@NOcharterSPAM.net （删除NO ..... SPAM）
"Jeff Thies" <no****@nospam.net> wrote in message
news:XU*****************@newsread1.news.atl.earthl ink.net...
| I''d like to place a "caption" under an image and insert both
into the flow
| of text.
|
| I''m thinking of something like this:
|
| (Styles shown inline for readability, they would be defined as
classes)
|
| <div style="float: left; padding: 10px"><img
src="some_image.jpg"><div>my
| caption/credit</div></div>
| <p> enough content to flow around the image....</p>
|
| Perhaps the image container should have a margin set rather
than padding,
| but padding doesn''t break badly in old broken browsers like
NS4.
|
| Seems like there should be a better way to do this. This is
such basic
| stuff!
|
| What about inserting the image (and caption) into the flow of
the paragraph?
| Aren''t block level elements not allowed in paragraphs?
|
| What''s the level of support for <object data="some_image_path"
| type="image/jpg"> ? (or is that jpeg). My IE5 (win 98) ignores
the image and
| my Opera 7 and NS7.1 both ignore any text following the object.
Haven''t
| checked Mac. But that doesn''t seem right. I used the example
here:
| <http://www.w3.org/TR/html4/struct/objects.html>
|
| And, no, I don''t want to add the "caption" with photoshop!
|
| I wasn''t quite sure where to post this, I hope 3 groups isn''t
overkill!
|
| Jeff
|
Jeff,
Why don''t you just place a <br> between the image and caption and
get rid of the caption div? It worked for me on a sample I did.
It also validates strict 4.01 and looks ok in my browsers (IE6,
NN7.1, Moz1.4, & Opera 7.11).
http://webpages.charter.net/rwtest/s...ge_caption.htm
hth
--
Chet
ng******@NOcharterSPAM.net (remove NO.....SPAM)
这篇关于字幕图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
