DMOZ中文网站分类目录-免费收录各类优秀网站的中文网站目录.
  • DmozDir.org
DMOZ目录快速登录入口-免费收录各类优秀网站的中文网站目录.由人工编辑,并提供网站分类目录检索及地区分类目录检索,是站长免费推广网站的有力平台!

css超出部分不显示怎么设置?

  • css超出部分不显示怎么设置?

  • 已被浏览: 109 次2020年09月04日    来源:  https://www.dmozdir.org/
  • 我们可以为元素框设置overflow:hidden;样式使超出元素框的内容不显示。overflow属性规定当内容溢出元素框时发生的事情。我们也可以通过这个属性设置滚动条。
    平时我们布局时候,有的文字内容多了会超过溢出我们限制的高度,有的图片会撑破DIV,让网页错位变乱。我们可以通过css设置超出部分不显示解决。

    我们可以为元素框设置overflow:hidden;样式使超出元素框的内容隐藏。

    overflow属性介绍:

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

    这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制。因此,有可能即使元素框中可以放下所有内容也会出现滚动条。

    属性值:

    • visible 默认值。内容不会被修剪,会呈现在元素框之外。

    • hidden 内容会被修剪,并且其余内容是不可见的。

    • scroll 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。

    • auto 如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。

    • inherit 规定应该从父元素继承 overflow 属性的值。

    示例:

    通过overflow:hidden;样式设置超出部分不显示:

    <html>
    <head>
    <style type="text/css">
    div 
    {
    background-color:#00FFFF;
    width:150px;
    height:150px;
    overflow: hidden;
    }
    </style>
    </head>
    
    <body>
    <p>如果元素中的内容超出了给定的宽度和高度属性,overflow 属性规定当内容溢出元素框时发生的事情。</p>
    
    <div>
    这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制。
    因此,有可能即使元素框中可以放下所有内容也会出现滚动条。默认值是 visible。
    </div>
    </body>
    
    </html>

    效果图:

    1.jpg

    以上就是css超出部分不显示怎么设置?的详细内容,更多请关注DMOZ中文网站分类目录其它相关文章!


    以上信息来源于网络,如有侵权,请联系站长删除。

    TAG:CSS

  • 上一篇:css怎么让文字水平居中?
  • 与“css超出部分不显示怎么设置?”相关的资讯
  • css--常见左右盒子宽度高度自适应布局
  • CSS ::marker 让文字序号更有意思
  • CSS 奇思妙想 | Single Div 绘图技巧
  • CSS(1)基础语法、常见属性
  • 使用 CSS prefers-* 规范,提升网站的可访问性与健壮性