HTML的浮动与定位

元素的浮动属性float，属性值有：元素向左（left）、元素向右（right）和元素不浮动（none）。

清除浮动有clear，常用的属性值有：不允许向左浮动（left）、不允许向右浮动（right）和同时清除左右浮动（none）。

overflow属性是清除浮动，对元素应用“overflow：hidden；”样式，也可以清除浮动对该元素的影响，该方法弥补了空标记清除浮动的不足；常用的属性值有：内容不会被修剪（visble）、溢出来的内容会被修剪，并且被修剪的内容是不可见（hidden）、在需要时生产滚动条，即自适应所要显示的内容、溢出内容会被修剪，且浏览器会始终显示滚动条。

position属性用于定义元素的定位模式，常用的属性值有：静态定位（static）、相对定位，相对于其原文档流的位置进行定位(relative)、绝对定位，相对于其上一个已经定位的元素进行定位（absolute）、固定定位，相对于浏览器窗口进行定位（fixed）。

行内元素：特点是不必再新的一行开始，同时也不强迫其他元素在新的一行显示。常见的有：strong、b、i、em、del、s、ins、等，span是最典型的行内元素。

块元素：特点是每个块元素通常都会独自占据一整行或多整行，可以对其设置宽度、高度、对齐等属性。常见的有：<li> <p> <ol> <ul> <div> <h1>——<h6>等。

span标记常用于定义网页中某些特殊显示的文本，配合class属性使用。

HTML的浮动与定位相关推荐

三、关于网页布局你该知道这些！（布局总结：标准流、浮动、定位）
一个完整的网页,是标准流.浮动.定位一起完成布局的,三者都有自己专门的用法. 标准流可以让盒子上下排列喝着左右排列,垂直的块级盒子显示就用标准流布局. 浮动可以让多个块级元素一行显示或者左右对齐盒 ...
CSS中文档流之普通流，浮动及定位、浮动特性及清除浮动的方式、定位模式，子绝父相搭配定位方式、z-index层级
文档流: 普通流(normal flow): 字面意思是普通流或者标准流,也就是常说的文档流,指网页内标签正常是从上到下,从左到右排列的意思,css的定位机制有3种:普通流(标准流).浮动.定位. 浮 ...
CSS3 浮动与定位
CSS3 浮动与定位浮动浮动特点清除浮动高度塌陷(清浮动) 定位相对定位绝对定位固定定位层级浮动 float:方向让块级元素在一行 <!DOCTYPE html> &l ...
CSS框模型，浮动，定位以及其他属性
CSS框模型,浮动,定位以及其他属性 1.CSS 框模型 (Box Model) 规定了元素框处理元素内容.内边距.边框和外边距的方式 element : 元素. padding : 内边距,也 ...
Bootstrap——制作个人简历网页、工具类【边框（添加、删除、颜色、圆角）、清除浮动、颜色（文本、链接、背景）、display属性、浮动、定位、文本对齐】
制作个人简历网页代码: <!DOCTYPE html> <html><head><meta charset="UTF-8">< ...
CSS核心内容-标准流、盒子模型、浮动、定位
CSS核心内容-标准流.盒子模型.浮动.定位,了解了核心内容才能用CSS设计出一个简单的页面一.基础在了解核心内容之前需要先了解HTML中的两种标签:块级元素,行内元素: 块级元素:一个块级元素占 ...
1.01.21盒子模型，浮动，定位
1.01.21盒子模型,浮动,定位 1.盒子模型 1. 标准文档流网页在排版布局时,遵循的从上到下,从左到右的顺序正常的元素是会占据页面的空间大小的脱离文档流:不再遵循从上往下,从左往右的顺序( ...
阿ken的HTML、CSS的学习笔记_浮动与定位（笔记六）
欢迎光临你好我是阿ken 文章目录 6.1_元素的浮动 6.1.1_元素的浮动属性 float 6.1.2_清除浮动 clear 6.2_overflow 属性 6.3_元素的定位 6.3.1_元 ...
CSS中浮动和定位对元素宽度/外边距/其他元素所占空间的影响
一.width:auto和width:100%的区别 1.width:100%的作用是占满它的参考元素的宽度.(一般情况下参考元素 == 父级元素,这里写成参考元素而不是父级元素,在下面我会再细说) ...
【css】浮动和定位对元素的宽度-外边距或其他元素的影响
一.width:auto和width:100%的区别 1.width:100%的作用是占满它的参考元素的宽度.(一般情况下参考元素 == 父级元素,这里写成参考元素而不是父级元素,在下面我会再细说) ...

HTML的浮动与定位

HTML的浮动与定位相关推荐

最新文章

热门文章