免费发布信息
微信公众号

CSS中浮动和定位有什么区别?

   来源:黔优网责任编辑:优优  时间:2023-07-14 13:25:25 浏览量:55
导读:其实浮动的本意是用来解决图片和文字的排版问题,但是由于它十分好用,所以被大部分开发者应用到了网页布局中,并成为了公认布局的一种方式。接下来,我们通过一个demo演示一下浮动和定位在网页布局中的使用,如demo

其实浮动的本意是用来解决图片和文字的排版问题,但是由于它十分好用,所以被大部分开发者应用到了网页布局中,并成为了公认布局的一种方式。

接下来,我们通过一个demo演示一下浮动和定位在网页布局中的使用,如demo1所示。

<html lang""en"> <meta charset="UTF-8">浮动和定位   header   aside   section   footer   floatdiv

用浏监器打开demo1.页面效果如图。
1679902617021_浮动和定位.png

在demo1中,使用浮动的知识对页面进行了布局,也就是图1-13中的header、aside、section、footer区域,然后使用绝对定位知识创建了一个浮动的div元素floatdiv。需要注意的是,position:absolute会导致元素脱离文档流,被定位的元素等于在文档中不占据任何位置,在另一个层呈现。float也会导致元素脱离文档流,但还在文档或容器中占据位置,把文档流和其他float元素向左或向右挤,并可能导致换行。

 
 
 
没用 0举报 收藏 0
免责声明:
黔优网以上展示内容来源于用户自主上传、合作媒体、企业机构或网络收集整理,版权争议与本站无关,文章涉及见解与观点不代表黔优网官方立场,请读者仅做参考。本文标题:CSS中浮动和定位有什么区别?,本文链接:https://www.qianu.com/news/250917.html,欢迎转载,转载时请说明出处。若您认为本文侵犯了您的版权信息,或您发现该内容有任何违法信息,请您立即点此【投诉举报】并提供有效线索,也可以通过邮件(邮箱号:kefu@qianu.com)联系我们及时修正或删除。
 
 

 

 
推荐图文
推荐商业资讯