CSS基础知识（display和visibility、overflow、文档流）

9、显示与隐藏

u display属性：

(1)none：隐藏元素，不会再占有页面的任何空间，即不会影响布局。

(2)inline：默认值。将元素[显示]为内联元素（与HTML元素本身无关系）

(3)block：将元素[显示]为块极元素 (与HTML元素本身无关系)

(4)inline-block：将元素显示为行内块级元素

即设置宽度和高度有效(符合块级元素)；可以水平排列即不会独占一行(符合内联元素)

u visibility属性：

(1)visible：默认值

(2)hidden：隐藏元素，占有页面的空间位置

10、内容溢出(overflow)

内容溢出：当文本内容过多时，可能显示会超出当前元素的区域

解决 ---overflow属性：

(1) visible 默认值，表示不处理

(2) hidden 将溢出部分的内容进行隐藏,溢出的文本内容无法查看

(3) scroll 将溢出部分的内容隐藏，提供了滚动条，且滚动条效果始终都显示

(4) auto (最好方式) 自动: 当内容溢出时，提供滚动条；当内容没有溢出时，不提供滚动条

11、文档流

概念：垂直方向从上到下的顺序排列(分成一行一行)，水平方向从左到右的顺序排列

【默认情况下，排列的顺序不能改变】

u 块级元素(每个元素独占一行)：

在文档流中自上向下排列（垂直方向排列）；

在文档流中默认的宽度是父元素100%；且默认的高度是所有子元素的高度总和

u 内联元素(每个元素不会独占一行)：

在文档流中自左向右水平排列（水平方向排列）；

宽度和高度都由内容确定

注: 如果在一行中不能容纳所有的元素，则会换到下一行，继续自左向右排列。

【元素离开文档流而存在，分别是浮动、绝对定位、固定定位】

CSS基础知识（display和visibility、overflow、文档流）相关推荐

css span 右端对齐_CSS标准文档流
web页面的制作,是个"流",像水流一样,必须从上往下,一点点的编织,不像画画,可以这个地方画一个,另一个地方画一个,随意而为. 标准文档流的一些微观现象 1. 空白折叠现象 1) ...
overflow+文档流
子元素默认是存在父元素的内容区,理论上讲子元素的最大可以等于父元素内容区大小, 如果子元素的大小超过了父元素的内容区,则超过的大小会在父元素以外的位置显示,超出父元素的内容,我们称为溢出的内容父元素 ...
一天搞定CSS：浮动（float）及文档流--10
浮动(float),一个我们即爱又恨的属性.爱,因为通过浮动,我们能很方便地布局: 恨,浮动之后遗留下来太多的问题需要解决,特别是IE6-7(以下无特殊说明均指 windows 平台的 IE浏览器). ...
Java 基础知识总结（附PDF文档）
您好!我是岛上程序猿,感谢您阅读本文,欢迎一键三连哦. 这篇基础知识总结包括六个章节,可以下载保存后慢慢看,希望对您有帮助! https://download.csdn.net/download/m0 ...
Java基础知识（二）—— API文档
一.API是Java提供的基本编程接口,API文档详细说明了Java中常用类和方法的功能,开发者可以通过查阅API文档,调用应用程序接口(API)来编程.用于告诉开发者如何使用这些基础类及这些类中包含 ...
信息检索（基础知识一）——词项-文档关联矩阵及倒排索引构建
sdnu 202011000106 实现内容: (本文中用到的文件名为:hyatt-k,有需要可以留言) 利用文件读取方法对给定邮件数据集中的文本文件进行预处理,并按照图1中的词项词典构造流程生成词项 ...
html的绝对定位脱离文档流吗,子元素position:absolute定位之后脱离文档流，怎么使子元素撑开父元素...
纯粹的CSS无法实现.因为position:absolute就是脱离文档流,怎么能让父元素不塌陷呢? 目前想到的只能用js和jquery来实现了,用js获取子元素的高度,赋值给父元素. test .o ...
从文档流来看内联元素和块元素的css排版
veda原创[抄录]讲得很好存自己这里看从文档流来看内联元素和块元素的css排版 CSS文档流与块级元素(block).内联元素(inline),之前翻阅不少书籍,看过不少文章, 看到所多的是零碎的 ...
html css基础知识
1 这是自己学习html时候做的一些记录,供大家参考 <!-- 2 块和内联3 块元素:独占一行的元素4 div p h ul5 div没有任何语义,就是一个纯粹的快元素6 就是为了方便布局7 ...

CSS基础知识（display和visibility、overflow、文档流）

CSS基础知识（display和visibility、overflow、文档流）相关推荐

最新文章

热门文章