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

<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. PCIE的DMA和PIO介绍

    墨尘 百家号01-2422:14 在PCIE中有两种数据传输方式: DMA(Direct Memory Access),直接内存访问,在该模式下,数据传送不是由CPU负责处理,而是由一个特殊的处理器D ...

  2. 基于Nginx实现10万+并发,你应该做的Linux内核优化

    由于默认的linux内核参数考虑的是最通用场景,这明显不符合用于支持高并发访问的Web服务器的定义,所以需要修改Linux内核参数,是的Nginx可以拥有更高的性能: 在优化内核时,可以做的事情很多, ...

  3. SourceInsight自定义常用快捷键

    1.快速显示文件大纲,类似于eclipse中的Ctrl+O: “Options”-"Key Assignments"-"Symbol: Browse Local File ...

  4. sqlite遇到database is locked问题的完美解决

    这两天在项目中用大强度大频率的方法测试时遇到sqlite报database is locked的问题,分析下来原因是sqlite对数据库做修改操作时会做(文件)锁使得其它进程同一时间使用时会报该错误( ...

  5. WCF寄宿到Windows Service

    WCF寄宿到Windows Service[1] 2014-06-14 WCF寄宿到Windows Service参考 WCF寄宿到Windows Service 返回 在前面创建一个简单的WCF程序 ...

  6. jQuery-File-Upload文件上传

    http://blueimp.github.io/jQuery-File-Upload/index.html

  7. .Net应该学什么怎么学(二)

    更新时间:2012年06月05日18时23分 来源:传智播客.Net 接上篇<[我来解惑].Net应该学什么怎么学(一)>. 二.C#面向对象基础 初学者学面向对象的时候没必要(也做不到) ...

  8. 【WPF】C#代码动态添加控件的Margin属性

    需求:一组按钮的数据是从服务器中Json数据发过来的,需要根据这个Json数据动态地添加这组按钮. 工具:使用http://www.newtonsoft.com/json来解析Json. 过程:C#代 ...

  9. JVM Client Server启动设置

    看看你下面的这两个文件,是不是尺寸差别很大?%JAVA_HOME%/jre/bin/client/jvm.dll%JAVA_HOME%/jre/bin/server/jvm.dll   Jvm动态库有 ...

  10. EMC检测标准