丸子学CSS（学习15分钟 - 容器、溢出、元素类型）

内容溢出

overflow属性

规定当内容溢出元素框时发生的事情

默认值：visible，内容不会被修剪
hidden：溢出裁切，溢出内容不可见
scroll：无论内容是否有溢出都会显示滚动条的位置，溢出的内容可见
auto：如果内容有溢出，就显示对应方向溢出的滚动条，没有溢出则不显示滚动条
inherit：继承父元素的overflow的属性值

• visible

  
  

• hidden

  
  

• scroll

  
  

文本溢出

text-overflow属性

clip: 默认值,只是简单地裁剪,不显示省略号.
ellipsis: 显示省略号.

单行文本省略号的设置（单行文本溢出显示省略号的必要条件）

.container {
  width: 200px;
  white-space:nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

元素类型

元素的分类：块状元素、内联元素

1）置换元素

浏览器根据元素的标签和属性来决定元素的具体显示内容
常见的置换元素

img ，input , object , select , textarea

2）非置换元素

除了置换元素以外，大部分html元素都是非置换元素，其内容直接显示在浏览器中，当给元素设置float后，就等价于转换为块元素