Welcome! 登入 註冊
專區首頁 專區百科 專區論壇 專區部落格 專區地圖

Advanced

Change History

Message: [CSS] 文繞圖用法與注意事項（img style="float:right"）

討論區清單 文章列表
Changed By: JinJin
Change Date: October 22, 2011 04:29PM

[CSS] 文繞圖用法與注意事項（img style="float:right"）
<style>#phorum div.message-body br {clear:none;}</style><img src="http://mepopedia.com/group/ncnu-dfll/avatar.png" style="float:left;margin:0 20px 20px">首先，而要達到「文繞圖」。在 &lt;img> 裡面加上 style="float:left" (圖片置左) 或 style="float:right" (圖片置右) 就可以了。<img src="http://mepopedia.com/group/ncnu-dfll/avatar.png" style="float:right;margin:20px">
例如：
&lt;img src="圖片網址" [color=#FF0000]style="float:left;"[/color]/> (圖片置左)
&lt;img src="圖片網址" [color=#FF0000]style="float:right;"[/color]/> (圖片置右)

同時，這邊要特別提醒的是：「<b>圖片要放在文字之前</b>」。不然就失去效果了。例如，這篇文章的第一個小公仔就是放在文章的一開始，而第二個小公仔就是放在第一段文字的「......就可以了同時，這邊要特別提醒的是：「<b>無論置左置右，圖片都要放在文字之前</b>」。不然就失去效果了。例如，這篇文章的第一個小公仔就是放在文章的一開始，而第二個小公仔就是放在第一段文字的「......就可以了。」之後。這樣編排後，就會出現現在文章中的效果。


以這篇文章的原始碼作為「文繞圖」的例子，<b>請特別注意文字與圖片的「前後關係」！</b>
<xmp><img src="http://mepopedia.com/group/ncnu-dfll/avatar.png" style="float:left;margin:0 20px 20px">
首先，而要達到「文繞圖」。在 &lt;img> 裡面加上 style="float:left" (圖片置左) 或 style="float:right" (圖片置右) 就可以了。
<img src="http://mepopedia.com/group/ncnu-dfll/avatar.png" style="float:right;margin:20px">
例如：
&lt;img src="圖片網址" [color=#FF0000]style="float:left;"[/color]/> (圖片置左)
&lt;img src="圖片網址" [color=#FF0000]style="float:right;"[/color]/> (圖片置右)

同時，這邊要特別提醒的是：「<b>圖片要放在文字之前</b>」。不然就失去效果了。例如......</xmp>
Changed By: HP
Change Date: September 28, 2011 04:49PM

[CSS] 文繞圖用法與注意事項（img style="float:right"）
首先，而要達到「文繞圖」。在 <img> 裡面加上 style="float:left" (圖片置左) 或 style="float:right" (圖片置右) 就可以了。
例如：
<img src="圖片網址" [color=#FF0000]style="float:left;"[/color]/> (圖片置左)
<img src="圖片網址" [color=#FF0000]style="float:right;"[/color]/> (圖片置右)

同時，這邊要特別提醒的是：「圖片要放在文字之前」。不然就失去效果了。例如，這篇文章的第一個小公仔就是放在文章的一開始，而第二個小公仔就是放在第一段文字的「......就可以了同時，這邊要特別提醒的是：「無論置左置右，圖片都要放在文字之前」。不然就失去效果了。例如，這篇文章的第一個小公仔就是放在文章的一開始，而第二個小公仔就是放在第一段文字的「......就可以了。」之後。這樣編排後，就會出現現在文章中的效果。


以這篇文章的原始碼作為「文繞圖」的例子，請特別注意文字與圖片的「前後關係」！
<img src="http://mepopedia.com/group/ncnu-dfll/avatar.png" style="float:left;margin:0 20px 20px"><br /> 首先，而要達到「文繞圖」。在 &lt;img> 裡面加上 style="float:left" (圖片置左) 或 style="float:right" (圖片置右) 就可以了。<br /> <img src="http://mepopedia.com/group/ncnu-dfll/avatar.png" style="float:right;margin:20px"><br /> 例如：<br /> &lt;img src="圖片網址" [color=#FF0000]style="float:left;"[/color]/> (圖片置左)<br /> &lt;img src="圖片網址" [color=#FF0000]style="float:right;"[/color]/> (圖片置右)<br /> <br /> 同時，這邊要特別提醒的是：「<b>圖片要放在文字之前</b>」。不然就失去效果了。例如......

Original Message

作者: HP
Date: September 28, 2011 04:48PM

文繞圖用法與注意事項（img style="float:right"）
首先，而要達到「文繞圖」。在 <img> 裡面加上 style="float:left" (圖片置左) 或 style="float:right" (圖片置右) 就可以了。
例如：
<img src="圖片網址" [color=#FF0000]style="float:left;"[/color]/> (圖片置左)
<img src="圖片網址" [color=#FF0000]style="float:right;"[/color]/> (圖片置右)

同時，這邊要特別提醒的是：「圖片要放在文字之前」。不然就失去效果了。例如，這篇文章的第一個小公仔就是放在文章的一開始，而第二個小公仔就是放在第一段文字的「......就可以了同時，這邊要特別提醒的是：「無論置左置右，圖片都要放在文字之前」。不然就失去效果了。例如，這篇文章的第一個小公仔就是放在文章的一開始，而第二個小公仔就是放在第一段文字的「......就可以了。」之後。這樣編排後，就會出現現在文章中的效果。


以這篇文章的原始碼作為「文繞圖」的例子，請特別注意文字與圖片的「前後關係」！
<img src="http://mepopedia.com/group/ncnu-dfll/avatar.png" style="float:left;margin:0 20px 20px"><br /> 首先，而要達到「文繞圖」。在 &lt;img> 裡面加上 style="float:left" (圖片置左) 或 style="float:right" (圖片置右) 就可以了。<br /> <img src="http://mepopedia.com/group/ncnu-dfll/avatar.png" style="float:right;margin:20px"><br /> 例如：<br /> &lt;img src="圖片網址" [color=#FF0000]style="float:left;"[/color]/> (圖片置左)<br /> &lt;img src="圖片網址" [color=#FF0000]style="float:right;"[/color]/> (圖片置右)<br /> <br /> 同時，這邊要特別提醒的是：「<b>圖片要放在文字之前</b>」。不然就失去效果了。例如......