資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理
化學
生物
數學
英語
經濟學
心理
社會研究
時尚研究
法律研究如何用浮動圖片 in HTML page?
要在 HTML 中使用浮動圖片，請使用 CSS 屬性 float。它允許你使影像向左或向右浮動。更多屬性值包括以下內容
| 序號 | 屬性值和說明 |
|---|---|
| 1 | none |
| 2 | left |
| 3 | right |
| 4 | initial |
示例
你可以嘗試執行以下程式碼，以便在 HTML 中使用浮動圖片。以下是 float right 和 float left CSS 屬性的用法
<!DOCTYPE html> <html> <head> <title>HTML Floating Image</title> </head> <body> <h1>Float Right</h1> <p>The below image floats to the right.</p> <p> <img src="https://tutorialspoint.tw/green/images/logo.png" style="float:right" width="190" height="84" /> This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. </p> <h1>Float Left</h1> <p>The below image floats to the left.</p> <p> <img src="https://tutorialspoint.tw/green/images/logo.png" style="float:left" width="190" height="84" /> This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. </p> </body> </html>
輸出
更新日期：2021 年 12 月 22 日
20K+ 瀏覽
廣告