欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

求帮助,图片和文本要在一行显示_html/css_WEB-ITnose

程序员文章站 2022-06-04 17:07:01
...
html 文本互排 想要实现下面的样式,左边是图片,右边是文本。

我自己做的第二行文本比第一行向前突出一些,文本没有对齐。不知道怎么实现文本对齐。

回复讨论(解决方案)

图片设置背景,append-left= 前面宽度

你用什么方式实现的,设置图片block,然后使用float吗?

也可以像ul那样,用background-image+padding-left实现

css代码:

img.pic{                float:left;                margin-right:10px;                margin-bottom:5px;                vertical-align:top;            }            p.context{                                margin:0px;                font-size:16px;                font-weight:bold;                display:inline;            }

html代码:
求帮助,图片和文本要在一行显示_html/css_WEB-ITnose

第2截面第3测点裂缝计采集值1.06mm高于警戒值1mm


高手给看看,要如何改。

左边一个div,display:inline-block右边一个div,同样,图片放左边一个div,文字放右边一个,就行了

或者直接用table,方法与上类似

图片设置背景,append-left= 前面宽度
append-left是什么东东?

左边一个div,display:inline-block右边一个div,同样,图片放左边一个div,文字放右边一个,就行了

或者直接用table,方法与上类似
不想用table,按你说的第一种方式不管用,能不能具体点?多谢。


图片设置背景,append-left= 前面宽度
append-left是什么东东?
是 padding-left 写错了

你改成这样试试



            p.context{                margin:0px;                font-size:16px;                font-weight:bold;                padding-left:50px;                background:url(img/warning.png) no-repeat;            }


左边一个div,display:inline-block右边一个div,同样,图片放左边一个div,文字放右边一个,就行了

或者直接用table,方法与上类似
不想用table,按你说的第一种方式不管用,能不能具体点?多谢。
用 display:inline-block样式让div渲染为行内元素,就不会换行了,只要尺寸合适不被挤下去
或者 用float:left 让div浮动,同样不会换行,只要尺寸合适不被挤下去


求帮助,图片和文本要在一行显示_html/css_WEB-ITnose

文字



明白了?



图片设置背景,append-left= 前面宽度
append-left是什么东东?
是 padding-left 写错了

你改成这样试试



            p.context{                margin:0px;                font-size:16px;                font-weight:bold;                padding-left:50px;                background:url(img/warning.png) no-repeat;            }


按照你说的真的解决了,谢谢你。



左边一个div,display:inline-block右边一个div,同样,图片放左边一个div,文字放右边一个,就行了

或者直接用table,方法与上类似
不想用table,按你说的第一种方式不管用,能不能具体点?多谢。
用 display:inline-block样式让div渲染为行内元素,就不会换行了,只要尺寸合适不被挤下去
或者 用float:left 让div浮动,同样不会换行,只要尺寸合适不被挤下去


求帮助,图片和文本要在一行显示_html/css_WEB-ITnose

文字



明白了?
用其他的方式解决了问题,不过还是要谢谢你。

问题解决了,