page contents

HTML中关于div标签里设置其它标签居中问题解决办法

设置div中的标签居中(隔山打牛) 最近在一次布局的练习题中是模仿出微博的首页,原以为很简单,但在第一个导航栏中就卡壳了,就是设置div中的input标签怎么也设置不到水平居中的效果,查了很...

attachments-2021-06-EeVhA43L60d937abeb904.png

设置div中的标签居中(隔山打牛)

最近在一次布局的练习题中是模仿出微博的首页,原以为很简单,但在第一个导航栏中就卡壳了,就是设置div中的input标签怎么也设置不到水平居中的效果,查了很多资料也没找到解决办法,但也受到了一些启发。

问题如下图:

attachments-2021-06-GOYCKo7Z60d9376cbed91.png

微博图片是和父类div高度相同的,但发现input标签发生了向下的偏移,代码如下:

attachments-2021-06-26Bl3Bva60d9375156d22.png

我找了很久的资料,试了很多也没能让倔强的input居中,但最终还是受启发解决了,于是在这里写下来,希望能帮到后面的人。

其实很简单,只需在img标签里设置align属性为center就可以了,如下:

attachments-2021-06-quvduNnf60d937440626a.png

页面如下:

attachments-2021-06-Sh2aqMLJ60d93728b38d2.png

上去了,完美解决_^。

一些思考

我看到有的说在div中的其它标签设置居中需要参照物,有的是加&bnsp(空格)可以解决,我想我的这个方法应该也是这个原理,虽然需要移动的是input标签,但实际上它的居中样式参照了前面的img标签,所以更改img标签属性为居中就解决了,这可谓是好一招隔山打牛啊。

如果大家以后在div中遇到类似问题,我想也可以尝试一下这招隔山打牛。

更多相关技术内容咨询欢迎前往并持续关注六星社区了解详情。

程序员编程交流QQ群:805358732

如果你想用Python开辟副业赚钱,但不熟悉爬虫与反爬虫技术,没有接单途径,也缺乏兼职经验
关注下方微信公众号:Python编程学习圈,获取价值999元全套Python入门到进阶的学习资料以及教程,还有Python技术交流群一起交流学习哦。

attachments-2022-06-rCQvKtbJ62ad2b7f82114.jpeg

0 条评论

请先 登录 后评论
轩辕小不懂
轩辕小不懂

2403 篇文章

作家榜 »

  1. 轩辕小不懂 2403 文章
  2. Pack 1131 文章
  3. 小柒 1046 文章
  4. Nen 576 文章
  5. 王昭君 209 文章
  6. 文双 71 文章
  7. 小威 64 文章
  8. Cara 36 文章