当前位置: 首页 > 知识库问答 >
问题:

请问css怎么实现如下效果?

司空锋
2024-06-26


宽度不定,图片和主要参建单位居中对齐,右边文字可以换行但是第一行和参建单位对齐

共有5个答案

通京
2024-06-26

1、margin: 0 auto;
2、flex

如果只一行(使用div元素)使用 margin 方式最简单。

司马项明
2024-06-26

image.png

  1. 先外层 flex,顶部对齐。
  2. 左边 div 中,flex items-center
  3. 右边,设置好上下 padding 使文字和左边文字对齐。
商辰钊
2024-06-26

两边行高一样就行

司马羽
2024-06-26

哪有什么左边文字右边文字,直接一行文字,然后设置文字居中就可以了

<div style="text-align: center;">    xxxx单位:xxxxxxxx有限公司、xxxxxxxx有限公司</div><div style="text-align: center;">    xxxx单位:xxxxxxxx有限公司、xxxxxxxx有限公司、xxxxxxxx有限公司</div>
锺博耘
2024-06-26

是不是想要下面的效果。

看下代码实现:
image.png
第一个span模仿了你需要的图片,最主要的是div中使用了display布局。给p标签flex:1,当页面宽度不足以放下p的内容时就会换行。

 类似资料: