替换< IMG ALIGN = RIGHT ...>与CSS等效 [英] Replacing <IMG ALIGN=RIGHT ...> with CSS equivalent
问题描述
当我更换旧的< IMG ALIGN = RIGHT ...>带有CSS定义的标签
< IMG class = right ...>
xxx.css：
IMG.right {BORDER：0; align：right}
我注意到效果不一样。虽然在过去文本在图片周围顺畅流动
在右侧现在有一个硬切：文本，然后下面的图片左边有空白区域，最后是
文本继续下面的图片。
我如何实现文本像以前一样在图片周围流动？
T.
Ted Mencini写道：
当我更换旧版< IMG ALIGN =对...>带有CSS定义的标签
< IMG class = right ...>
xxx.css：
IMG.right {BORDER： 0; align：right}
我注意到效果不一样
这是因为没有aligh" CSS中的属性。
我如何实现文本像以前一样在图片周围流动？
查找浮动属性
-
David Dorward< http://dorward.me.uk/>
Ted Mencini写道：
当我替换旧的< IMG ALIGN = RIGHT ...>带有CSS定义的标签
< IMG class = right ...>
xxx.css：
IMG.right {BORDER： 0; align：right}
使用CSS时，不要简单地将HTML属性放入样式表中。 CSS
有自己的一组属性，只是偶尔与过时的
HTML属性重叠。
没有这样的属性CSS中的对齐。您正在寻找
''浮动''属性。如果浏览器使用align属性执行任何操作，那么
它的专有行为将无法在多个浏览器中运行。
< p>
< img src =" ..." ALT =" ..." />
Lorem ipsum dolor sit amet，consectetuer adipiscing elit。 Phasellus ornare，
justo vitae faucibus ornare，est enim pretium elit，in hendrerit tortor
purus ac dolor。每个conubia类别的taciti sociosqu ad litora torquent
nostra，per perosos hymenaeos。 Ut et nisl。 Fusce sed erat。 Proin ut est eu
arcu interdum volutpat。 Vestibulum nibh velit，congue nec，sodales vel，
faucibus eu，magna。 Cras odio quam，adipiscing nec，luctus eu，pellentesque
nec，urna。整数feugiat，velit et ultrices tempus，sapien erat molestie
dolor，id pretium felis justo ac lectus。 Cum sociis natoque penatibus et
magnis dis parturient montes，nascetur ridiculus mus。 Fusce nec erat。 Nam
euismod tortor eget urna。 praesent vestibulum。
< / p>
img {
float：right;
}
-
Jim Dabell
好奇的事情正在发生，当我使用display：inline;和背景：
url（）;我的对象（< div>你称之为对象吗？）消失了。
Jim Dabell写道：
Ted Mencini写道：
当我更换旧的< IMG ALIGN = RIGHT ...>带有CSS定义的标签
< IMG class = right ...>
xxx.css：
IMG.right {BORDER： 0; align：right}
使用CSS时，不要简单地将HTML属性放入样式表中。 CSS
有自己的一组属性，偶尔会与过时的HTML属性重叠。
CSS中没有''align'这样的属性。您正在寻找
''float''属性。如果浏览器使用align属性执行任何操作，那么它的专有行为将无法在多个浏览器中运行。
< p>
< img src = " ..." ALT =" ..." />
Lorem ipsum dolor sit amet，consectetuer adipiscing elit。 Phasellus ornare，
justo vitae faucibus ornare，est enim pretium elit，in hendrerit tortor
purus ac dolor。类似于每个conubia的每个conubia sociosqu ad litora torquent
nostra，per perosos hymenaeos。 Ut et nisl。 Fusce sed erat。 Proin ut est eu
arcu interdum volutpat。 Vestibulum nibh velit，congue nec，sodales vel，
faucibus eu，magna。 Cras odio quam，adipiscing nec，luctus eu，pellentesque
nec，urna。整数feugiat，velit et ultrices tempus，sapien erat molestie
dolor，id pretium felis justo ac lectus。 Cum sociis natoque penatibus et
magnis dis parturient montes，nascetur ridiculus mus。 Fusce nec erat。 Nam
euismod tortor eget urna。 praesent vestibulum。
< / p>
img {
float：right;
}
When I replaced older <IMG ALIGN=RIGHT ...> tags with a CSS definition
<IMG class=right ...>
xxx.css:
IMG.right { BORDER: 0; align: right }
I notice that the effect is NOT the same. While in the past the text was flowing smoothly around the picture
on the right side there is now a hard cut: Text, then picture below with white space on the left and finally
the text continues BELOW the picture.
How do I achieve that the text is flowing around the picture as before ?
T.
Ted Mencini wrote:
When I replaced older <IMG ALIGN=RIGHT ...> tags with a CSS definition
<IMG class=right ...>
xxx.css:
IMG.right { BORDER: 0; align: right }
I notice that the effect is NOT the same
This is becuase there is no "aligh" property in CSS.
How do I achieve that the text is flowing around the picture as before ?
Look up the float property
--
David Dorward <http://dorward.me.uk/>
Ted Mencini wrote:
When I replaced older <IMG ALIGN=RIGHT ...> tags with a CSS definition
<IMG class=right ...>
xxx.css:
IMG.right { BORDER: 0; align: right }
When using CSS, you don''t simply put HTML attributes into a stylesheet. CSS
has its own set of properties that only occasionally overlap with obsolete
HTML attributes.
There is no such property as ''align'' in CSS. You are looking for the
''float'' property. If a browser does anything with an align property, then
it''s proprietary behaviour that will not work across multiple browsers.
<p>
<img src="..." alt="..." />
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus ornare,
justo vitae faucibus ornare, est enim pretium elit, in hendrerit tortor
purus ac dolor. Class aptent taciti sociosqu ad litora torquent per conubia
nostra, per inceptos hymenaeos. Ut et nisl. Fusce sed erat. Proin ut est eu
arcu interdum volutpat. Vestibulum nibh velit, congue nec, sodales vel,
faucibus eu, magna. Cras odio quam, adipiscing nec, luctus eu, pellentesque
nec, urna. Integer feugiat, velit et ultrices tempus, sapien erat molestie
dolor, id pretium felis justo ac lectus. Cum sociis natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Fusce nec erat. Nam
euismod tortor eget urna. Praesent vestibulum.
</p>
img {
float: right;
}
--
Jim Dabell
A curious thing is happening, when I use display:inline; and background:
url(); my object(<div> do you call that an object?) disappears.
Jim Dabell wrote:
Ted Mencini wrote:When I replaced older <IMG ALIGN=RIGHT ...> tags with a CSS definition
<IMG class=right ...>
xxx.css:
IMG.right { BORDER: 0; align: right }
When using CSS, you don''t simply put HTML attributes into a stylesheet. CSS
has its own set of properties that only occasionally overlap with obsolete
HTML attributes.
There is no such property as ''align'' in CSS. You are looking for the
''float'' property. If a browser does anything with an align property, then
it''s proprietary behaviour that will not work across multiple browsers.
<p>
<img src="..." alt="..." />
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus ornare,
justo vitae faucibus ornare, est enim pretium elit, in hendrerit tortor
purus ac dolor. Class aptent taciti sociosqu ad litora torquent per conubia
nostra, per inceptos hymenaeos. Ut et nisl. Fusce sed erat. Proin ut est eu
arcu interdum volutpat. Vestibulum nibh velit, congue nec, sodales vel,
faucibus eu, magna. Cras odio quam, adipiscing nec, luctus eu, pellentesque
nec, urna. Integer feugiat, velit et ultrices tempus, sapien erat molestie
dolor, id pretium felis justo ac lectus. Cum sociis natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Fusce nec erat. Nam
euismod tortor eget urna. Praesent vestibulum.
</p>
img {
float: right;
}
这篇关于替换< IMG ALIGN = RIGHT ...>与CSS等效的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
