css两个文字水平居中并列

admin 轻心小站 关注 LV.19 运营
发表于前端技术学习版块 css,教程

CSS可以让我们轻松实现两个文字在一个元素中水平居中并列。 .container{ display: flex; justify-content: center; } .text{ margin:0

CSS可以让我们轻松实现两个文字在一个元素中水平居中并列。

 .container{
        display: flex;
        justify-content: center;
    }

    .text{
        margin:0 10px;
    } 

首先,我们创建一个包含两个文字的元素,这个元素的class为container。

使用CSS的flex布局,我们可以让这个container元素中的子元素水平居中。具体代码如下:

 .container{
        display: flex;
        justify-content: center;
    } 

接下来,我们为每个子元素添加样式。我们使用margin来让这两个文字之间有一定的间距,具体代码如下:

 .text{
        margin:0 10px;
    } 

注意,这里我们为每个子元素创建了一个class名为text,其样式为margin:0 10px;

这样,我们就成功实现了两个文字在一个元素中水平居中并列的效果。

文章说明:

本文原创发布于探乎站长论坛,未经许可,禁止转载。

题图来自Unsplash,基于CC0协议

该文观点仅代表作者本人,探乎站长论坛平台仅提供信息存储空间服务。

评论列表 评论
发布评论

评论: css两个文字水平居中并列

粉丝

0

关注

0

收藏

0

已有0次打赏