>>分享Web前端开发技术,并对孙卫琴的《精通Vue.js:Web前端开发技术详解》提供技术支持 书籍支持  卫琴直播  品书摘要  在线测试  资源下载  联系我们
发表一个新主题 开启一个新投票 回复文章 您是本文章第 26166 个阅读者 刷新本主题
 * 贴子主题:  CSS 布局 Overflow 控制内容溢出 回复文章 点赞(0)  收藏  
作者:sunshine    发表时间:2019-08-16 12:03:27     消息  查看  搜索  好友  邮件  复制  引用

  

CSS 布局 - Overflow

     CSS overflow  属性用于控制内容溢出元素框时显示的方式。


#overflowTest {

    background: #4CAF50;

    color: white;

    padding: 15px;

    width: 80%;

    height: 100px;

    overflow: scroll;

    border: 1px solid #ccc;

}

div.visible {

    padding: 4px;

    background-color: #eee;

    width: 200px;

    height: 100px;

    overflow: visible;

    xborder: 1px dotted red;

}

CSS Overflow

     CSS overflow  属性可以控制内容溢出元素框时在对应的元素区间内添加滚动条。

     overflow属性有以下值:

            
描述
visible 默认值。内容不会被修剪,会呈现在元素框之外。
hidden 内容会被修剪,并且其余内容是不可见的。
scroll 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。
auto 如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。
inherit 规定应该从父元素继承 overflow 属性的值。


             注意:overflow 属性只工作于指定高度的块元素上。

             注意: 在 OS X Lion ( Mac 系统) 系统上,滚动条默认是隐藏的,使用的时候才会显示 (设置 "overflow:scroll" 也是一样的)。                    

overflow: visible

             默认情况下,overflow 的值为 visible, 意思是内容溢出元素框。                            

范例

div   {
     width:   200 px  ;
     height:   50 px  ;
     background-color:   #eee  ;
     overflow:   visible  ;
}



程序猿的技术大观园:www.javathinker.net



[这个贴子最后由 flybird 在 2020-02-19 12:03:49 重新编辑]
  Java面向对象编程-->异常处理
  JavaWeb开发-->访问数据库(Ⅱ)
  JSP与Hibernate开发-->映射一对多关联关系
  Java网络编程-->用Spring整合CXF发布Web服务
  精通Spring-->Vue指令
  Vue3开发-->创建综合购物网站应用
  VSCode 开发Vue必备插件
  vue3-Composition-API的用法
  JS中==和===的区别
  animate.css动画样式类型库的用法
  彻底明白VUE中的done参数和函数作用
  Vue watcher的高级用法
  基于vue和springmvc前后端分离,json类接口调用介绍
  加快 Vue 项目的开发速度
  JS 循环删除数组
  用Vue-Awesome-Swiper实现旋转叠加轮播效果,平移轮播效果
  HTML5 内联 SVG
  HTML 表格标签的用法
  HTML 头部的元素的用法
  JavaScript 测试 jQuery
  JavaScript 正则表达式
  更多...
 IPIP: 已设置保密
楼主      
1页 0条记录 当前第1
发表一个新主题 开启一个新投票 回复文章


中文版权所有: JavaThinker技术网站 Copyright 2016-2026 沪ICP备16029593号-2
荟萃Java程序员智慧的结晶,分享交流Java前沿技术。  联系我们
如有技术文章涉及侵权,请与本站管理员联系。