css 设置图片与文字的对齐方式 求教

html-css06

css 设置图片与文字的对齐方式 求教,第1张

这里给你解释一下 <p>也算是一个容器,什么叫容器,比如罐子,碗,等,可以在里面放东西的都属于容器 而<img>不是容器,只是显示反映图片 <p style="text-align:left" 为什么写在<p>里面,举例说明,一个纸盒子,我里面放个球,那么我想把球放到中间,那么你说,我的操作是对于哪个而言呢? 这个中间,肯定是对应于纸盒子,而非球 所以,这里的style 是写在p里面 而不是 img 至于style="vertical-align我也不大清楚,你可以去百度查一下这个属性的意思。

img是内联元素,p标签是块级元素,所以p标签内的文字换行很正常。strong标签是内联元素,所以会跟img处于同一行,想要img跟strong中的文字垂直居中对齐,需要设置img的vertical-align为middle。

需要准备的材料分别有:电脑、浏览器、html编辑器。

1、首先,打开html编辑器,新建html文件,例如:index.html。

2、在index.html中的<style>标签中,输入css代码:img {float: left}。

3、浏览器运行index.html页面,此时div标签中的左侧图片与右侧图片通过css调整为了浮动而顶部对齐了。