博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
由css样式继承想到的
阅读量:5244 次
发布时间:2019-06-14

本文共 795 字,大约阅读时间需要 2 分钟。

  一个问题,怎么设置一个div盒子撑满整个屏幕?

    
123
a

  这里有两个方法:

1.  

html,body,#father-body{        height: 100%;        background-color:#123456;        border: 2px solid black;}.item1{        border: 2px solid yellow;        background-color: #654321;}

  

  效果如下:

2.

#father-body{        position:fixed;        width: 100%;        height:100%;        background-color:#123456;        border: 2px solid black;}.item1{        border: 2px solid yellow;        background-color: #654321;}

  

  效果如下:

  

  在标准文档流里,子代选择器默认继承父选择器的样式,宽度默认100%继承,高度则默认根据元素自身而定;html/body/div默认占满一行,故增加height:100%即可;

  position:fixed/absolute使元素脱离标准文档流,#father-body设置width:100%,height:100%,#father-bod内的item1默认继承#father-body的样式(width:100%)。

转载于:https://www.cnblogs.com/wangssf/p/5459564.html

你可能感兴趣的文章
路由器外接硬盘做nas可行吗?
查看>>
python:从迭代器,到生成器,再到协程的示例代码
查看>>
pytest的参数化测试
查看>>
Java多线程系列——原子类的实现(CAS算法)
查看>>
docker运行环境安装-centos(一)
查看>>
安装Pygame和pip的艰辛之路
查看>>
http 协议状态码
查看>>
adroid swipeRefreshLayout无法显示进度条的问题
查看>>
windows和linux执行class
查看>>
Android -- 短信发送器
查看>>
如何用Math.max.apply()获取数组最大/小值
查看>>
【BZOJ3139】[HNOI2013]比赛(搜索)
查看>>
数据结构(C语言第2版)----时间复杂度和单链表
查看>>
ASP.NET一般处理程序新建一个方法里使用context.Response.Write的解决方法
查看>>
spark出现task不能序列化错误的解决方法
查看>>
[转]oracle in 多个字段
查看>>
今天内容2017-10-15
查看>>
环境搭建与DOS命令
查看>>
计算机网络之面试常考
查看>>
Linux 简介
查看>>