最大最小宽高，css默认样式，css重置样式

最新推荐文章于 2022-06-18 11:31:23 发布

九阈

最新推荐文章于 2022-06-18 11:31:23 发布

阅读量184

点赞数

分类专栏： # CSS

本文链接：https://blog.csdn.net/weixin_46048542/article/details/119654091

版权

CSS 专栏收录该内容

39 篇文章 4 订阅

订阅专栏

最大最小宽高
min-width、min-height
max-width、max-height
%单位:换算->已父容器的大小进行换算

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div{width: 100px;min-height: 100px;/* 最低高度是100px */border: 1px red solid;}
        #box1{width: 200px;height: 200px;background-color: darkmagenta
        ;}
        #box2{width: 50%;height: 50%;background-color: indigo;}
    </style>
</head>
<body>
    <div>
        晏青篁
        晏青篁
        晏青篁
        晏青篁
        晏青篁
        晏青篁
        晏青篁
        晏青篁
        晏青篁
        晏青篁
        晏青篁
        晏青篁
        晏青篁
    </div>
    <div id="box1">
        <div id="box2"></div>
    </div>
</body>
</html>

在这里插入图片描述
一个容器怎么适应屏幕的高：容器加height:100% ，body和html为100%。

html,body{height:100%;}
.contrainer{height:100%;}

css默认样式
有默认样式：div、span
没有默认样式：body、h1.。。。h6、p、u1
body->margin:8px
h1->margin:上下 21.440px
font-weight:bold
p->margin:上下 16px
ul->margin：上下 16px padding：左 40px
默认 list-style:disc
a->text-decoration:underline
css重置样式

*{margin:0;padding:0}
li{list-style:none}
img{vertical-align:bottom}
body,p,h1,ul{margin:0;padding:0:}
a{text-decoration:none;}

在这里推荐一个网址，里面含有好几个初始化css的代码：
添加链接描述
https://segmentfault.com/a/1190000009369872

九阈

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
最大最小宽高，css默认样式，css重置样式

最大最小宽高min-width、min-heightmax-width、max-height%单位:换算->已父容器的大小进行换算<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport"
复制链接

扫一扫