关于CSS3中的min-height等的使用
一、min-height
当我们需要让某个容器不能低于某个高度,但是不能将高度固定在这个高度,希望其能够随着容器内内容的增多而变高时,我们可以对容器设置一个min-height来让该容器获得该特性。(通俗来讲,当容器内容高度已经超过最小高度时,容器就会随着内容的高度变化而变化)
注意点:1.min-height属性不能为负值 2.最小高度不包括容器边框、外边距、填充。(最小高度是会包括内边距的,这意味着当上下内边距与内容高度之和大于最小高度时,容器会被撑大)
二、max-height
该属性与min-height类似,当内容小于最大高度时,容器高度会随内容的减少而进行压缩,而内容大于最大高度时,容器不会随着内容的增多而变大,而内容会直接溢出容器
注意点:1.max--height属性不能为负值 2.最大高度不包括外边距、内边距、边框。
最大宽度与最小高度与上述两者相似
关于CSS3中的min-height等的使用的更多相关文章
- CSS3中的3D动画实现(钟摆、魔方)--实现代码
CSS3中的3D动画实现(钟摆.魔方) transition-property 过渡动画属性 all|[attr] transition-duration 过渡时间 transition-delay ...
- css3-10 css3中的边框样式有哪几种
css3-10 css3中的边框样式有哪几种 一.总结 一句话总结:1.border-radius 2. box-shadow 3.border-image三种,box一种border两种 1.css ...
- img及父元素(容器)实现类似css3中的background-size:contain / background-size:cover
img及父元素(容器)实现类似css3中的background-size:contain / background-size:cover <!DOCTYPE html> <html ...
- CSS3中惊艳的gradient
以前曾经记录过linear-gradient(线性渐变)和 radial-gradient(径向渐变)的语法. 可以参考<CSS3中border-radius.box-shadow与gradie ...
- CSS3中flexbox如何实现水平垂直居中和三列等高布局
最近这些天都在弥补css以及css3的基础知识,在打开网页的时候,发现了火狐默认首页上有这样一个东西.
- CSS3中的动画功能(一)
css3中的动画功能分为transitions功能和animations功能,这两种功能都可以通过改变css属性值来产生动画效果.今天带大家一起来看看css3动画功能中的transitions的用法. ...
- CSS3中的变形与动画【转】
最近在学习制作移动端的页面,做了一个微信页面的小demo,其中用到了很多的CSS3新增的内容,其中就有CSS3新增的变形和动画.其实这种CSS3的动画效果用JS也可以实现,不过CSS3能开启硬件加速, ...
- css3中transition和animation的回调处理
弱鸡最近在准备面试,网上找了一些题,发现一些基础题也完全答不好(┬_┬)看来还是要再接再励啊w(゚Д゚)w 言归正传,今天的主题是CSS3中的动画回调处理,这里动画执行完毕后触发的事件是transit ...
- [css] CSS3中的单位
FROM http://www.qianduan.net/understand-the-unit-of-length-in-the-css.html CSS3中的单位: css3中引入了一些新的单位: ...
- CSS3中DIV水平垂直居中-2(3)
用到CSS3中display的新属性. HTML <div class="parent"> </div> CSS html,body{ width: 100 ...
随机推荐
- 大数据开源平台CDH 集群(CM6.3.1 + CDH 6.3.2)的部署
一,概述 我依照博文:https://www.cnblogs.com/liugp/p/16286645.html ,进行了CDH集群的部署.总体来说,基本比较顺利. 在部署过程中,发生了一些小问题.本 ...
- docker 安装mongodb
一.安装mongodb 我们首先改一下镜像源,避免拉去速度太慢 创建daemon.json文件:位于/etc/docker目录下: 登录阿里云 即可 2.docker 搜索mongo镜像 然后pull ...
- AutoCAD专用卸载工具,完美彻底卸载清除干净AutoCAD各种残留注册表和文件。
AutoCAD专用卸载工具,完全彻底卸载删除干净AutoCAD各种残留注册表和文件的方法和步骤.如何卸载AutoCAD呢?有很多同学想把AutoCAD卸载后重新安装,但是发现AutoCAD安装到一半就 ...
- python翻译(一)
有道翻译 # -*- coding: UTF-8 -*- import requests import time import random import hashlib #用于md5加密 ''' 有 ...
- Keil51单片机数码管鬼影显示问题
Keil51单片机数码管鬼影显示问题 所为的鬼影就是程序逻辑正确,但电路逻辑有问题.就是按程序逻辑,前一个数字显示后,直接显示下一组数字,因为没清干净,导致瞬间残留: 处理的办法,就是有就显示,没有就 ...
- DevExpress 动态换肤
我们都知道Devexpress内置了很多themes,那要怎么在使用时动态更改呢. 下面是方法以: 1.如果你们已经有主题了,那就在XAML中删除类似下下面的语句. dx:ThemeManager.T ...
- WSL2安装了Ubuntu之后root不知道密码
更新了WSL2,安装完 Ubuntu 只要求新建账号和密码,不知道root密码,各种不方便Ubuntu 的默认 root 密码是随机的,即每次开机都有一个新的 root 密码在终端输入命令 sudo ...
- QML调用C++程序
QML调用C++程序 1. 添加C++,MouseMemory文件(.h,.cpp) 2. 在main.cpp文件添加, qmlRegisterType<MouseMemory>(&quo ...
- select remove option safari 兼容
select 移除某一 option 的 javascript 公司用的代码是 var ddlPrimaryResource = document.getElementById(ddlPrimaryR ...
- 1071 - Specified key was too long; max key length is 767 bytes
set global innodb_large_prefix=on;set global innodb_file_format=BARRACUDA; 主从都要修改以上2个参数.