您好,登錄后才能下訂單哦!
這篇文章主要介紹了css3中float屬性怎么用,具有一定借鑒價值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。
css中,float屬性用于定義元素在哪個方向浮動,語法為“元素{float:value}”;當屬性的值為“left”可設置元素向左浮動;當屬性的值設置為“right”可設置元素向右浮動;當屬性的值設置為“none”可設置元素不浮動。
本教程操作環境:windows10系統、CSS3&&HTML5版、Dell G3電腦。
float屬性定義元素在哪個方向浮動。以往這個屬性總應用于圖像,使文本圍繞在圖像周圍,不過在 CSS 中,任何元素都可以浮動。浮動元素會生成一個塊級框,而不論它本身是何種元素。
如果浮動非替換元素,則要指定一個明確的寬度;否則,它們會盡可能地窄。
假如在一行之上只有極少的空間可供浮動元素,那么這個元素會跳至下一行,這個過程會持續到某一行擁有足夠的空間為止。
該屬性的屬性值如下:
示例如下:
<html> <head> <style type="text/css"> img { float:right } </style> </head> <body> <p>在下面的段落中,我們添加了一個樣式為 <b>float:right</b> 的圖像。結果是這個圖像會浮動到段落的右側。</p> <p> <img src="/i/eg_cute.gif" /> 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> </body> </html>
輸出結果:
感謝你能夠認真閱讀完這篇文章,希望小編分享的“css3中float屬性怎么用”這篇文章對大家有幫助,同時也希望大家多多支持億速云,關注億速云行業資訊頻道,更多相關知識等著你來學習!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。