CSS居中总结

最新推荐文章于 2024-03-21 12:20:23 发布

Goodbye_yesterday

最新推荐文章于 2024-03-21 12:20:23 发布

阅读量204

点赞数 1

分类专栏： html&CSS

本文链接：https://blog.csdn.net/Goodbye_/article/details/105179980

版权

html&CSS 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

水平居中

1.行盒，行块盒居中

设置父元素text-align: center;

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
       div{
           margin : 30px;
           background: lightblue;
           height : 100px;
           text-align : center;
       }

</style>
<body>
    <div>
        <a href="">.......................</a>
    </div>
 
</body>
</html>

2.常规流块盒

定宽 width：1000px;

margin-left,margin-right:设置为auto

3.绝对定位元素水平居中

定宽 width：1000px;

left : 0; right : 0;

margin-left,margin-right:设置为auto

垂直居中

1.单行文本的垂直居中

line-height: 包含块的高度

Goodbye_yesterday

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
CSS居中总结

1.行盒，行块盒居中水平居中：设置父元素text-align: center;<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial...
复制链接

扫一扫

专栏目录