怎样使div块居中对齐?

怎样使div块居中对齐?,第1张

1、在 DIV 标签对中写入的正文标签的 HTML 中<div></div>。

2、然后我们将 div 设置为宽高度, 我们需要注意的是, 如果您不设置默认值的宽度为100% 哦, 所以它将填充整个页面。

3、然后我们设置 Div 的边距, 第一个参数指示顶部的距离为 0, 第二个自动表示自动。也就是说, 在设置此设置后, div 将根据页面自动居中。

4、浏览效果好后, 您可以看到此时 DIV 块已自动居中, 它与浏览器的左右两侧距离相同。

div里面的文字底部对齐可以通过设置如下css样式实现

1

2

display:table-cell

/*按照单元格的样式显示元素*/

vertical-align:bottom

/*底对齐*/

举个例子:

创建html元素

1

文字在div的底部对齐

添加css样式

1

2

3

4

5

div{

width:200pxheight:50px

/*设置div的大小*/

border:4px

solid

#beceeb

/*为了便于观察,显示出边框*/

display:table-cell

vertical-align:bottom

显示效果

两个div都设置为display:

inline-block这样可能会出现两个div顶端不对齐的情况,可以在右侧div设置vertical-align:

top

*

{

margin:

0

padding:0}

.left

{

display:

inline-block

}

.right

{

display:

inline-block

vertical-align:

top

//与左侧div顶部对齐

}


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7364906.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-04
下一篇 2023-04-04

发表评论

登录后才能评论

评论列表(0条)

保存