文档章节

height:100%;怎样才会有效果

cobish
 cobish
发布于 2015/04/13 22:47
字数 127
阅读 43
收藏 0
点赞 0
评论 0

1、让div高度100%起作用,必须给它的父级标签也设置height:100%。

<html style="height: 100%;">
    <body style="height: 100%;">
        <div style="height: 100%;">
            <p>这样这个div的高度就会100%了</p>
        </div>
    </body>
</html>


2、该方法注意事项:

  • 高度100%的div如果设置了高度上的margin和padding,页面就会出现滚动条,div高度变得比100%还大。

  • 如果div的实际高度高于设置的100%,div的高度会自动扩展。


© 著作权归作者所有

共有 人打赏支持
cobish
粉丝 33
博文 150
码字总数 45747
作品 0
深圳
CSS常用小技巧

一、使用行高来实现垂直居中 elm { height: 24px; line-height: 24px; } 当你有一个固定高度的容器时,并且只有单行内容,此时要实现元素的垂直居中,最好的办法就是设置元素的line-height和...

奔小康 ⋅ 2013/01/31 ⋅ 2

谁能帮我解释下VS2010中以下代码的含义?

大体含义我知道,是当点击时弹出页面,但具体怎样实现的,还请指教: .aspx文件 管理员用户管理 脚本文件 function showTab(url, title) { var tab = $('#tab'); if (tab.tabs('exists', tit...

嵇智 ⋅ 2012/11/13 ⋅ 2

图片垂直居中(2015-12-11更新)

#main{ position:fixed; height:80%; width:100%; top:10%;}.c,.p{ border:1px #000 solid; width:20%; height:80%; float:left; font-size:0;/去掉字符间距/ text-align:center;}.c>img:fir......

一行代码 ⋅ 2015/12/03 ⋅ 0

CSS定位问题(3):相对定位,绝对定位

引子: 开始的时候我想先要解决一个问题,怎么设置一个div盒子撑满整个屏幕? 看下面的html代码: XHTML 1 2 3 4 5 <body> <div id="father-body"> <div class="item1"></div> </div> </bod......

-鹏 ⋅ 2016/05/04 ⋅ 0

position:relative和absolute以及css height

position属性 <无论怎样设置 始终文字框都无法紧贴浏览器边框……剩下的缝隙简直诱发强迫症 body { overflow: hidden;} .container{position:relative; z-index:998; padding:2rem;top: 0px...

phala ⋅ 2015/07/31 ⋅ 0

input元素浮动被挤下来

为什么红色的输入框被挤下来,而不是和黄色的按钮重叠在一行,怎样才能在红色框设置100%时候,黄色按钮和红色框在一行并浮动在右边

vbphp爱好者 ⋅ 2017/02/19 ⋅ 3

更改AlertDialog窗口大小的方法

AlertDialog dialog = new AlertDialog.Builder(this).create();dialog.show();WindowManager.LayoutParams params = dialog.getWindow().getAttributes();params.width = 200;params.height......

guoliang ⋅ 2014/07/12 ⋅ 0

底部始终在最底部的五种方法

1.设置下边距为负值等于底部高度 css: html, body { height: 100%; margin: 0 } .footer { width: 100%; background-color: firebrick; } .content { min-height: 100%; margin-bottom: -50......

kenneth5530 ⋅ 2016/11/15 ⋅ 0

手风琴效果和滑动条

由于本周开始编写 宝石迷阵这款益智游戏,其中涉及到的两个效果我觉得很有趣。 手风琴:点击一级餐单,二级菜单动态弹出;再次点击一级菜单,二级菜单缩回; 实现方法如下: 首先,用CSS和H...

Crazydonkey ⋅ 2014/08/04 ⋅ 0

初始化页面body为空的问题。

设置DIV大小的有两个属性width和height,以前在学习DIV每次给DIV设置100%宽度或高度时都很迷惑,不明确这个100%的宽度(高度)到底有多宽有多高?这个100%是从哪里得到的从哪里继承的?今天我...

marjey ⋅ 2016/12/15 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

如何使用serverchan微信推送告警

之前实现推送告警信息到微信的方法有如下几种: 1、通过企业公众号实现----收费: 2、通过QQ邮箱,在微信平台上开启收到邮件进行提醒; 3、第三方告警平台API,一般也是收费的; 不过最近看文...

问题终结者 ⋅ 29分钟前 ⋅ 0

TCP的RPC

RPC就是远程方法调用(Remote Process Call ),包含了客户端和服务端,涉及了对象的序列化传输。 1.服务端启动,注册远程调用的类2.客户端发送请求信息包含类、方法、参数的一些信息、序列化传...

Cobbage ⋅ 50分钟前 ⋅ 0

IOS-UI UI初步代码布局添加事件

ISO开发界面,UI是必须学习的一部分,其实很早之前想学来了,一直没有沉下心来学习。看到IOS的代码风格和布局就别扭的不行,跟java代码和android布局比较显得不是那么方便,所以一直到现在。...

京一 ⋅ 今天 ⋅ 0

浅谈OpenDaylight的二次开发

OpenDaylight作为一款开源SDN网络控制器,依托于强大的社区支持以及功能特性,成为了目前主流的SDN网络控制器开发平台。在比较稳定的OpenDaylight Helium版本中,已经为开发者提供了大量的网...

wangxuwei ⋅ 今天 ⋅ 0

API 开发中可选择传递 token 接口遇到的一个坑

在做 API 开发时,不可避免会涉及到登录验证,我使用的是jwt-auth 在登录中会经常遇到一个token过期的问题,在config/jwt.php默认设置中,这个过期时间是一个小时,不过为了安全也可以设置更...

等月人 ⋅ 今天 ⋅ 0

Java NIO之文件处理

程序要操作本地操作系统的一个文件,可以分为以下三个部分: 对文件位置的操作 对文件的操作 对文件内容的操作 其中,对文件内容的操作在 Java NIO之Channel 中已经有了介绍,通过FileChann...

士别三日 ⋅ 今天 ⋅ 0

Maven的pom.xml配置文件详解

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.......

小海bug ⋅ 今天 ⋅ 0

解决httpclient超时设置不生效的问题

最近公司有项目需要通过http调用第三方服务,且第三方服务偶有超时,故需要设置一定的超时时间防止不响应的情况出现。 初始设置如下: [java] view plain copy //超时设置 RequestConfig re...

Mr_Tea伯奕 ⋅ 今天 ⋅ 0

过滤器Filter和拦截器HandlerInterceptor

过滤器 依赖于servlet容器。在实现上基于函数回调,可以对几乎所有请求进行过滤,但是缺点是一个过滤器实例只能在容器初始化时调用一次。使用过滤器的目的是用来做一些过滤操作,获取我们想要...

hutaishi ⋅ 今天 ⋅ 0

Redis入门详解(转)

Redis入门详解 Redis简介 Redis安装 Redis配置 Redis数据类型 Redis功能 持久化 主从复制 事务支持 发布订阅 管道 虚拟内存 Redis性能 Redis部署 Redis应用场景 Redis总结 Redis简介: Redi...

xiaoyaoyoufang ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部