作为一个前端菜鸟，我又碰到问题了，今天把div放到li标签中，发现div并没有把li标签撑开，而是在li标签边界之外，具体情况如下图所示：

那么，怎样才能达到预期的效果（每个li中放置一个div标签，并且显示li的下边框）？只需要修改li标签的overflow属性即可，如下代码所示：

li{

    overflow: auto;

}

ok，问题完美解决，效果如下：

-------------------------------------------------------------------------------------------------

QQ群：871934478

版权所有，转载请注明源地址           

-------------------------------------------------------------------------------------------------

div放在li标签中，无法撑开li标签的问题的更多相关文章

  1. body标签中l的相关标签

    字体标签: h1~h6.font. u.b,.strong. em. sup. sub 排版标签: div,.span.br.hr.center.pre 图片标签: img 超链接: a 列表标签: ...

  2. 37-python中bs4获取的标签中如何提取子标签

    如果只是要提取一个标签 里面的属性值啥的,直接看这篇文章就可以了: 23-python用BeautifulSoup用抓取a标签内所有数据 如果是标签的嵌套,可以参考下面的思路,虽然不是很简洁,但是可以 ...

  3. C#后台实现在Grid标签中动态新增CheckBox标签（WPF中）

    页面代码 <Grid Margin="45,0,10,0" > <Grid.RowDefinitions> <RowDefinition Height ...

  4. 认识HTML中表格、列表标签以及表单控件

    前端之HTML,CSS(二) HTML标签 列表标签 无序列表:闭标签,由<ul><li></li>...</ul>组合而成,效果成纵向列表.格式:&l ...

  5. 关于<a></a>标签里嵌套<a></a>标签的bug

    当你用一个<a></a>标签时,在<a>标签中再插入一个<a></a>,此时,你会发现外面的<a>标签会重复出现,且有点混乱.找 ...

  6. 用正则表达式抓取网页中的ul 和 li标签中最终的值！

                获取你要抓取的页面 const string URL = "http://www.hn3ddf.gov.cn/price/GetList.html?pageno=1& ...

  7. JQuery中两个ul标签的li互相移动实现方法

    这篇文章主要介绍了JQuery中两个ul标签的li互相移动实现方法,可实现ul标签中li标签内容相互替换的技巧,涉及jQuery操作页面元素的相关技巧,需要的朋友可以参考下 本文实例讲述了JQuery ...

  8. Html中怎么用CSS让ul中多个li标签不换行横排显示

    布局 通常有三种方式 { 1. position 2. float: left --> 其次是这个 3. block: inline-block  --> 他们推荐我用这个 } 具体描述 ...

  9. LI 标签中让文章标题左对齐，日期右对齐的方法

    希望实现标题在左对齐,日期在右对齐,当直接给日期的span加上float:right时,IE8和FF都OK,但IE6/7则会换行,下面给出一个简单有效的解决办法. <!DOCTYPE html  ...

随机推荐

  1. 和我一起打造个简单搜索之Logstash实时同步建立索引

    用过 Solr 的朋友都知道,Solr 可以直接在配置文件中配置数据库连接从而完成索引的同步创建,但是 ElasticSearch 本身并不具备这样的功能,那如何建立索引呢?方法其实很多,可以使用 J ...

  2. 最小化安装centos5.5

    安装LINUX的办法: 使用光盘 通过网络批量安装LINUX系统 先搭建一个LINUX做为安装的数据源(DHCP服务器,kickat) 设置所有其他要安装LINUX服务器的电脑以NET的方式启动,然后 ...

  3. Java基础之Java 修饰符

    前言:Java内功心法之Java 修饰符,看完这篇你向Java大神的路上又迈出了一步(有什么问题或者需要资料可以联系我的扣扣:734999078) Java语言提供了很多修饰符,主要分为以下两类: 访 ...

  4. HashMap源码解读(JDK1.7)

    哈希表(hash table)也叫散列表,是一种非常重要的数据结构,应用场景及其丰富,许多缓存技术(比如memcached)的核心其实就是在内存中维护一张大的哈希表,而HashMap的实现原理也常常出 ...

  5. Linux 强制安装 rpm 包

    Linux 正常安装 rpm 的命令是: rpm -ivh xxx.rpm 重复安装时需加属性: 软件包重复安装将会失败,若仍需要安装必须加 --replacepkgs 属性 软件包的某个文件已在安装 ...

  6. https Java SSL Exception protocol_version

    在java代码中,使用HttpClient爬取https页面时,遇到了这个bug:javax.net.ssl.SSLException: Received fatal alert: protocol_ ...

  7. 《深入理解Java虚拟机》（一）Java虚拟机发展史

    Java虚拟机发展史 1.Sun Classic/Exact VM 1.Sun Classic:世界第一款商用Java虚拟机. 2.Exact VM:准确式GC:虚拟机可以知道内存中的某个位置的数据具 ...

  8. c# UTF-16转UTF-8 互转

    /// <summary> /// UTF-16转UTF-8 /// </summary> /// <param name="str">< ...

  9. CSS学习笔记07 盒子模型

    1.盒子模型 所谓盒子模型就是把HTML页面中的元素看作是一个矩形的盒子,也就是一个盛装内容的容器.每个矩形都由元素的内容.内边距(padding).边框(border)和外边距(margin)组成. ...

  10. 【代码笔记】Web-HTML-框架

    一,效果图. 二,代码. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...