前几天遇到一个问题,代码是这样一个层次:

<div class="province">
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>
</div>

我设置了div的边框,

要想ul的内容在边框内,

必须设置div高度。

但是,ul内的内容是变化的,内容少的时候就不及div的高度。

不设高度的时候,ul的内容就出现在边框外了。

原来需要设置ul的边框。想想也是,先设置与他关系最近的元素吧。

对于前端不是很专业的同僚来说,写css样式表还是有个规则比较好:

指定css样式要有层次:如上例,定义li的样式 .province ul li{...}

写样式有个大致顺序:容器大小(width,height......),容器位置(left,margin......),容器文本(color......),其他

这样尽可能避免样式覆盖之类的问题。

小技巧处理div内容溢出的更多相关文章

  1. div内容溢出

    前几天遇到一个问题,代码是这样一个层次: <div class="province"> <ul> <li>1</li> <li ...

  2. div内容溢出时显示滚动条

    在style中添加overflow:scroll属性即可.

  3. html/css/js小技巧实例

    一些学习中碰到的小技巧 让div自动撑起来: .clearfix:after{ content: "."; clear: both; display: block; visibil ...

  4. window.open的小技巧分享

        今天再次谈起window.open是因为发现了一个比较好玩的小技巧,详细内容我们稍后详细说明.       聊到window.open,不得不说明一下他的使用方法,主要有两种形式:   win ...

  5. window.open的小技巧分享(转)

    今天再次谈起window.open是因为发现了一个比较好玩的小技巧,详细内容我们稍后详细说明.       聊到window.open,不得不说明一下他的使用方法,主要有两种形式:   window. ...

  6. DIV内容超出固定宽度部分用省略号代替

    方法一:CSS控制溢出文本  只针对DIV单行数据展示 /** DIV文本超出宽度部分用...替换,鼠标移上显示全部 **/ .textAuto{overflow:hidden;text-overfl ...

  7. PHP开发者该知道的5个Composer小技巧

    Composer 是新一代的PHP依赖管理工具.本文介绍使用Composer的五个小技巧,希望能给你的PHP开发带来方便. 1. 仅更新单个库 只想更新某个特定的库,不想更新它的所有依赖,很简单 co ...

  8. 小技巧!CSS 整块文本溢出省略特性探究

    今天的文章很有意思,讲一讲整块文本溢出省略打点的一些有意思的细节. 文本超长打点 我们都知道,到今天(2020/03/06),CSS 提供了两种方式便于我们进行文本超长的打点省略. 对于单行文本,使用 ...

  9. 解决 SharePoint 2010 拒绝访问爬网内容源错误的小技巧(禁用环回请求的两种方式)

    这里有一条解决在SharePoint 2010搜索爬网时遇到的“拒绝访问错误”的小技巧. 首先要检查默认内容访问帐户是否具有相应的访问权限,或者添加一条相应的爬网规则.如果目标资源库是一个ShareP ...

随机推荐

  1. 【Android】3.18 示例18--自定义绘制功能

    分类:C#.Android.VS2015.百度地图应用: 创建日期:2016-02-04 简介:介绍自定义绘制点.线.多边形.圆等几何图形和文字 详述: (1)支持绘制凸多边形,如要绘制凹多边形请用三 ...

  2. nginx location URI匹配规则

    当nginx收到一个请求后,会截取请求的url部份,去搜索所有location指令中定义的URI匹配模式.在server模块中可以定义多个location指令来匹配不同的url请求,多个不同的loca ...

  3. android studio - 解决Android Studio不停的Indexing的问题

    File > Invalidate Caches/Restart

  4. Spark RDD、DataFrame和DataSet的区别

    版权声明:本文为博主原创文章,未经博主允许不得转载.   目录(?)[+]   转载请标明出处:小帆的帆的专栏 RDD 优点: 编译时类型安全 编译时就能检查出类型错误 面向对象的编程风格 直接通过类 ...

  5. VC++ 遍历目录

    遍历文件目录,即把一个目录里的文件名都取出来.本文是CFileFind类的使用实例的笔记.下面的程序是从一个目录出发,把这个目录里的所有成员按着层次输出. 代码如下: void TravelFolde ...

  6. 安装Tomcat配置环境变量

    我是从官网下载的zip,没有用installer. 从目前的情况来看,只要你配置好了JAVA_HOME, CLASSPATH, PATH,那么剩下的,目前看来,就只要配置好CATALINA_HOME即 ...

  7. 解决linux分区提示doesn't contain a valid partition table

    目前 partition table 大概有叁种: 最传统的 mbr.大容量的 gpt.小设备的 无; 遇上最后那种就会出现 "doesn't contain a valid partiti ...

  8. javascript 中XMLHttpRequest 实现前台向后台的交互

    使用XMLHttpRequest对象分为4部完成: 1.创建XMLHttpRequest组建 2.设置回调函数 3.初始化XMLHttpRequest组建 4.发送请求

  9. JS自动爆炸案例

    学习到了: setTimeout函数的灵活运用. 案例实现讲解: 1.先定义一个全局的变量,赋值为null. 2.然后使用timeout调用bang函数,以达到自动自动调用函数的功能. 3.bang函 ...

  10. Liunx 安装 Mysql 5.7

    #[安装 Mysql 5.7] # 00.系统目录说明# 安装文件下载目录:/data/software# Mysql目录安装位置:/usr/local/mysql# 数据库保存位置:/data/my ...