1. <html>
  2. <body>
  3. <head>
  4.   <style>
  5.    #menu{width:1000px;overfloat:hidden;}        /* width:1000px;overfloat:hidden; 父元素高度随子元素变化而变化 */
  6.    #menu ul{list-style-type:none;}
  7.    #menu ul li{float:left;margin-right:10px;}   /* float:left; 浮动横布局，让父元素高度变0px */
  8.   </style>
  9. </head>
  10. <div id="menu">
  11. <ul>
  12. <li><a href="#">C语言</a></li>
  13. <li><a href="#">Java语言</a></li>
  14. <li><a href="#">Javascript语言</a></li>
  15. </ul>
  16. </div>
  17. </html>
  18. </body>

　　

CSS父元素高度随子元素高度变化而变化的更多相关文章

  1. CSS实现父元素半透明，子元素不透明

    CSS实现父元素半透明,子元素不透明. 很久以来大家都习惯使用opacity:0.5在新式浏览器里实现半透明,而对IE较旧的版本使用filter:Alpha(opacity=0.5)的滤镜来实现半透明 ...

  2. 【IE6的疯狂之十】父级使用padding后子元素绝对定位的BUG

    在前端开发中,经常会用到css的position:absolute来使层浮动,前通过left,top,right等属性来对层进行定位,但ie6对left,top,right等属性的解释和ie7,ie8 ...

  3. 父元素设置min-height子元素设置100%问题

    问题:父元素设置min-height子元素高度设置100%取不到值,这是因为子元素 div设置 height:100%: 只有当父级元素满足min-height:1000px;设置的条件才触发: 浏览 ...

  4. jquery层级原则器（匹配父元素下的子元素）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. AngularJs中，如何在父元素中调用子元素为自定义Directive中定义的函数？

    最近一段时间准备使用AngularJs中的自定义Directive重构一下代码. 在这里说明一下,把自定义控件封装成Directive并不一定是要复用,而是要让代码结构更加清晰.就好像你将一个长方法拆 ...

  6. 【css】子元素浮动到了父元素外，父元素没有随子元素自适应高度，如何解决？

    正常情况 如果子元素没有设置浮动(float),父元素的高度会随着子元素高度的改变而改变的. 设置浮动以后 父元素的高度不会随着子元素的高度而变化. 例如:在一个ul中定义若干个li,并设置float ...

  7. html5shiv主要解决IE6-8 无法识别HTML5的新标签，父节点不能包裹子元素，以及应用CSS样式

    html5shivehtml5shiv主要IE6-8解决:1,HTML5提出的新的元素不被IE6-8识别.2,这些新元素不能作为父节点包裹子元素,3,并且不能应用CSS样式.让CSS 样式应用在未知元 ...

  8. 当fixed元素相互嵌套时chrome下父元素会影响子元素的层叠关系

    问题:fixed元素被另一个fixed元素包含的时候在chrome下fixed子元素的定位会受到父元素的影响. demo(http://jsbin.com/qumah/1): <!DOCTYPE ...

  9. 二、vue学习--父元素如何获取子元素的值，子元素如何获取父元素的值

      下图是父元素: 下图是子元素,获取父元素的值,使用props定义属性,这样就可以获取到父元素上传过来的set .place.type,拿到值就可以做一些自己的逻辑处理 二.子元素给父元素传值? 下 ...

随机推荐

  1. 【转发】PHP连接MSSQL数据库案例，PHPWAMP多个PHP版本连接SQL Server数据库

    转发自:http://blog.csdn.net/lccee/article/details/54289076 课前小知识普及:MSSQL和SQL Server是同一个软件,叫法不同而已,MSSQL全 ...

  2. java如何实现不固定个数传参

      CreateTime--2017年9月15日14:42:40 Author:Marydon java如何实现不固定个数传参(定义实参个数可变的方法) 参考链接:原文链接 传统方法:为这个方法定义一 ...

  3. Echarts折线图点击事件

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  4. django之创建第7-1个项目-url配置高级

    修改urls.PY文件 # -*- coding: UTF-8 -*- from django.conf.urls import patterns, include, url # Uncomment ...

  5. 三种分布式对象主流技术——COM、Java和COBRA

    既上一遍,看到还有一遍将关于 对象的, 分布式对象, 故摘抄入下: 目前国际上,分布式对象技术有三大流派——COBRA.COM/DCOM和Java.CORBA技术是最早出现的,1991年OMG颁布了C ...

  6. mysql8.x开启远程登录

    mysql8.x密码的认证方式变了,需要修改远程认证方式 问题描述 Connection to lab-130-mysql failed.Unable to load authentication p ...

  7. Uva10161 Ant on a Chessboard

    Uva10161 Ant on a Chessboard 10161 Ant on a Chessboard One day, an ant called Alice came to an M*M c ...

  8. 【TP3.2 + 其他任何PHP框架】编辑、删除、添加数据，返回原分页 （ajax+form两种方式提交均可以）

    1.目的1:在如下的一个页面中,p=2,比如我们删除数据id=13,通过ajax提交{id,p} 这2个参数,就可以了,页面返回json的url参数中原样带上p即可. 2.目的2: 步骤1:在如下页面 ...

  9. Comparable 与 Comparator

    Comparable & Comparator 都是用来实现集合中元素的比较.排序的,只是 Comparable 是在集合内部定义的方法实现的排序,Comparator 是在集合外部实现的排序 ...

  10. Java爬虫框架调研

    Python中大的爬虫框架有scrapy(风格类似django),pyspider(国产python爬虫框架). 除了Python,Java中也有许多爬虫框架. nutch apache下的开源爬虫程 ...