CSS-overflow

1. overflow:hidden; 超出的部分就不显示了。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div style="height:80px;width:90px;overflow:hidden;">
        <img src="1.png">
    </div>
</body>
</html>

运行结果：

2. overflow:auto 超过大小的话，就出现滚动条。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div style="height:80px;width:90px;overflow:auto;">
        <img src="1.png">
    </div>
</body>
</html>

运行结果：

时间： 2024-10-10 10:43:50

CSS-overflow的相关文章

Css Overflow 溢出属性实例代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>css属性实例</title>

css overflow(visible auto hidden scroll)教程

DIV CSS overflow (visible auto hidden scroll)语法结构与css overflow教程 Overflow可以实现隐藏超出对象内容,同时也有显示与隐藏滚动条的作用,接下来我们来了解学习css overflow样式.一.Overflow语法值 - TOP overflow : visible | auto | hidden | scroll 当然overflow可以单独设置X(overflow-x )和Y(overflow-y)方向的滚动条样式其值与应用与o

CSS overflow 属性

实例设置 overflow 属性: div { width:150px; height:150px; overflow:scroll; } 亲自试一试浏览器支持所有主流浏览器都支持 overflow 属性. 注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "inherit". 定义和用法 overflow 属性规定当内容溢出元素框时发生的事情. 说明这个属性定义溢出元素内容区的内容会如何处理.如果值为 scroll,不论是否需要,用户代理

CSS overflow white-space CSS3 text-overflow 属性

当div内内容超出大小时可用以下属性进行隐藏同时用div的title属性进行提示当鼠标放到上面时显示未被全部显示的内容 CSS 参考手册实例设置 overflow 属性: div { width:150px; height:150px; overflow:scroll; } 亲自试一试浏览器支持所有主流浏览器都支持 overflow 属性. 注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "inherit". 定义和用法 overfl

（转）CSS Overflow 属性

原文链接:http://www.qianduan.net/css-overflow-property.html 根据CSS的盒模型概念,页面中的每个元素,都是一个矩形的盒子.这些盒子的大小.位置和行为都可以用CSS来控制.对于行为,我的意思是当盒子内外的内容改变的时候,它如何处理.比如,如果你没有设置一个盒子的高度,该盒子的高度将会根据它容纳内容的需要而增长.但是当你给一个盒子指定了一个高度或宽度而里面的内容超出的时候会发生什么?这就是该添加CSS的overflow属性的时候了,它允许你设定该种

前端学习 -- Css -- overflow

子元素默认是存在于父元素的内容区中,理论上讲子元素的最大可以等于父元素内容区大小.如果子元素的大小超过了父元素的内容区,则超过的大小会在父元素以外的位置显示,超出父元素的内容,我们称为溢出的内容.父元素默认是将溢出内容,在父元素外边显示,通过overflow可以设置父元素如何处理溢出内容:可选值:visible,默认值,不会对溢出内容做处理,元素会在父元素以外的位置显示.hidden, 溢出的内容,会被修剪,不会显示.scroll, 会为父元素添加滚动条,通过拖动滚动条来查看完整内容,该属性不论

在项目中遇到关于 CSS Overflow Hidden在iPhone & Safari不起作用

调试了半天 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"> <title></title> <style> ht

CSS清除浮动技巧

一般浮动是什么情况呢?一般是一个盒子里使用了CSS float浮动属性,导致父级对象盒子不能被撑开,这样CSS float浮动就产生了. 本来两个黑色对象盒子是在红色盒子内,因为对两个黑色盒子使用了float浮动,所以两个黑色盒子产生了浮动,导致红色盒子不能撑开,这样浮动就产生了. 简单地说,浮动是因为使用了float:left或float:right或两者都是有了而产生的浮动. 二.浮动产生负作用 1.背景不能显示由于浮动产生,如果对父级设置了(CSS background背景)CSS背景颜色

CSS总结篇—可爱的浮动

浮动浮动是浏览器定位的一种方式,也是现在最常用的一种布局方式.通过两次的静态页面练习,加上查阅一些资料,对浮动进行了整理.总结了10种清除浮动的方式以及各自的优缺点.加深了对浮动的理解和认识. 一.浮动的特性 1.包裹性(BFC-块级元素上下文)2.破坏行(让父元素高度塌陷) 二.浮动产生的原因一般浮动是什么情况呢?一般是一个盒子里使用了CSS float浮动属性,导致父级对象盒子不能被撑开,这样CSS float浮动就产生了.

解决子级用css float浮动而父级div没高度不能自适应高度

解决子级对象使用css float浮动而父级div不能自适应高度,不能被父级内容撑开解决方法,父级div没有高度解决方法. 最外层的父级DIV不能自适应高度-不能随对象撑开没有高度当在对象内的盒子使用了float后,导致对象本身不能被撑开自适应高度,这个是由于浮动产生原因. 如何解决父div对象自适应高度,方法有三种,接下来DIVCSS5逐一介绍. 1.首先我们先看HTML源代码: <!DOCTYPE html> <html> <head> <meta cha