源代碼
點擊運行
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>教程</title> <style> div { float:right; width:120px; margin:0 0 15px 20px; padding:15px; border:1px solid black; text-align:center; } </style> </head> <body> <div> <img src="/images/logo.png" width="95" height="84" /><br> CSS is fun! </div> <p> This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. </p> <p> 在上面的段落中,div元素是120像素寬,它包含了圖像。 div元素會向右浮動。 Margins 被添加到div使得文本遠離div。 Borders和padding被添加到div框架的圖片和標題中 </p> </body> </html>
運行結果