css教程css3中float属性的用法是什么

 所属分类:web前端开发

 浏览:134次-  评论: 0次-  更新时间:2022-10-18
描述:更多教程资料进入php教程获得。 css中,float属性用于定义元素在哪个方向浮动,语法为“元素{float:value}”;当属性的值为“left”可设置...
更多教程资料进入php教程获得。

css中,float属性用于定义元素在哪个方向浮动,语法为“元素{float:value}”;当属性的值为“left”可设置元素向左浮动;当属性的值设置为“right”可设置元素向右浮动;当属性的值设置为“none”可设置元素不浮动。

前端(vue)入门到精通课程:进入学习
Apipost = Postman + Swagger + Mock + Jmeter 超好用的API调试工具:点击使用

本教程操作环境:windows10系统、CSS3&&HTML5版、Dell G3电脑。

css3中float属性的用法是什么

float属性定义元素在哪个方向浮动。以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动。浮动元素会生成一个块级框,而不论它本身是何种元素。

如果浮动非替换元素,则要指定一个明确的宽度;否则,它们会尽可能地窄。

假如在一行之上只有极少的空间可供浮动元素,那么这个元素会跳至下一行,这个过程会持续到某一行拥有足够的空间为止。

该属性的属性值如下:

24.png

示例如下:

<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>
登录后复制

输出结果:

25.png

(学习视频分享:css视频教程)

以上就是css3中float属性的用法是什么的详细内容,更多请关注zzsucai.com其它相关文章!

 标签: css,
积分说明:注册即送10金币,每日签到可获得更多金币,成为VIP会员可免金币下载! 充值积分充值会员更多说明»

讨论这个素材(0)回答他人问题或分享使用心得奖励金币

〒_〒 居然一个评论都没有……

表情  文明上网,理性发言!