转载自：https://www.cnblogs.com/heyode/p/5973960.html

<body>

  <div class="wrap">

    <div class="content"></div>

  </div>

  <style>

  body {

    margin: 0;

    padding: 0;

  }

  .wrap {

    border: 1px solid black;

    width:800px;

  }

  .content {

    width: 500px;

    height:400px;

    background-color: aqua;

  }

  </style>

</body>

在这里，我们没有给wrap设高度，其默认值为auto。当height设为auto时，该标签的高度由其子标签的高度决定，即：子标签会撑开父标签。

而div标签宽度的默认值为100%. 如果，wrap不设width属性，

<body>

  <div class="wrap">

    <div class="content"></div>

  </div>

  <style>

  .wrap {

    border: 1px solid black;

  }

  .content {

    width: 500px;

    height:400px;

    background-color: aqua;

  }

  </style>

</body>

效果如下：

css中height, width默认值的更多相关文章

  1. CSS中vertical-align的默认值baseline的理解

    写在前面的话 在学校业余学习了一个月的CSS,人生中第一篇博客就献给CSS了,欢迎大家指正文章中不正确的地方,在此感谢.在尝试开始写博客的时候查了好多资料,原本以为写自己熟悉的知识的博客很容易,没想到 ...

  2. 【CSS中width、height的默认值】

    对于初学者来说,CSS中的width.height的默认值是很神奇的,因为经常看到如下这样的代码:明明只给一个#father标签(红色的div)设置了一个width,为啥它在浏览器中显示出来是有一个固 ...

  3. css中的width,height，属性与盒模型的关系

    这段话很容易记住盒模型: css中盒子模型包含属性margin.border.padding.content,他们可以把它转移到我们日常生活中的盒子(箱 子)上来理解,日常生活中所见的盒子也具有这些属 ...

  4. css中height 100vh的应用场景，动态高度百分比布局，浏览器视区大小单位

    css中height 100vh的应用场景,动态高度百分比布局,浏览器视区大小单位 height:100vh 一些只能vw, vh才能完成的应用场景: 1. 场景之:元素的尺寸限制 vw vh 主要是 ...

  5. struts2视频学习笔记 03-06（Struts 2配置文件无提示问题，Action配置中的各项默认值，各种转发类型）

    课时3 解决Struts 2配置文件无提示问题(eclipse):window→preference→XML→XML Catlog

  6. sqlserver中GUID的默认值设置

    sqlserver中GUID的默认值设置 YID uniqueidentifier not null default (NEWSEQUENTIALID()), //有序GUID(只能用于表设计的时候的 ...

  7. c++ 中bool 的默认值

    比如在Test.h中定义变量: _isFirst; //Test.h头文件 #ifndef __TEST_H__ #define __TEST_H__ class Test{ private: boo ...

  8. MySQL5.7中的sql_mode默认值

    简介 在正常项目开发过程中,如果MySQL版本从5.6升级到5.7版本.作为DBA在考虑数据库版本升级带来的影响时,一般会有几个注意点: sql_mode 默认值的改变 optimizer_switc ...

  9. 弹窗中修改select默认值遇到的问题

    弹窗中修改select默认值无效 前提: 项目中遇到一个需求, 在一个弹窗中,有很多个select都是在打开弹窗的同时由js自动生成的(每次打开都自动重新生成一遍). 弹窗打开后,从每个select的 ...

随机推荐

  1. sqlliab7-8

    less-7 https://www.jianshu.com/p/20d1282e6e1d ?id=0')) union select 1,'2','<?php @eval($_POST[&qu ...

  2. 同步类的基础AbstractQueuedSynchronizer(AQS)

    同步类的基础AbstractQueuedSynchronizer(AQS) 我们之前介绍了很多同步类,比如ReentrantLock,Semaphore, CountDownLatch, Reentr ...

  3. IDEA 之 Java项目复制

    1.复制一个项目,并改名字  2.更改以下文件名字  3.将以下文件中的原有名字,替换成更改后的名字(例如MyWebapp07替换成MyWebapp08) 4.将out文件夹给删除 5.然后用IDEA ...

  4. JavaScript HTMlL DOM对象（上）

    Dom:document.相当于把所有的html文件,转换成了文档对象. 之前说过:html-裸体的人:css-穿上衣服:js-让人动起来. 让人动起来,就得先找到他,再修改它内容或属性. 找到标签 ...

  5. nginx 反向代理转发导致css，js，图片失效

    为什么80%的码农都做不了架构师?>>>   需要添加以下配置 location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ { proxy_pass htt ...

  6. 06 __init__ 和 __new__的关系和不同

    一. 双下new 和 双下init 关系 首先从__new__(cls,a,b,c)的参数说说起,__new__方法的第一个参数是这个类,而其余的参数会在调用成功后全部传递给__init__方法初始化 ...

  7. spring的后台数据校验

    数据校验对于开发项目来说是必须的.校验一般分为前台校验和后台校验,前台校验是必须要做的,后台校验是可选的.后台校验相对前台校验来说配置起来一般更复杂.前台校验通过js做,前台校验一般非常容易绕过.sp ...

  8. Collection接口【集合】和Iterator迭代器类

    1.1集合的概述 前面基础学习并使用过集合ArrayList<E>,那么集合究竟是什么呢? 集合:集合是Java中提供的一种容器,可以用来存储多个数据. 那么意思就是说集合是容器,但是容器 ...

  9. 学习RxJava+Retrofit+OkHttp+MVP的网络请求使用

    公司的大佬用的是这一套,那我这个菜鸟肯定要学习使用了. 我在网上找了很多文章,写的都很详细,比如 https://www.jianshu.com/u/5fd2523645da https://www. ...

  10. Code::Blocks20.03 编译报错

    Code::Blocks最近出了新版20.03,进入官网选择下载了附带MinGW版的安装包后,编译HelloWorld就报错(CB一直以来都有问题,新版还是这样...) 主要有两个问题: ld.exe ...