css里 在一个标签中如何使文字和左边图片对齐成顶部对齐，怎么布局啊？

html-css033

css里 在一个标签中如何使文字和左边图片对齐成顶部对齐，怎么布局啊？,第1张

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

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

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

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

、在div中，使用p标签创建一行文字，使用img创建一张图片。

2、设置div标签的class属性为mydiv。

3、在css标签内，通过class设置div的样式，设置它的宽度为400px，边框为1px，并将display属性设置为flex，实现flex布局。

4、在css标签内，将align-items属性设置为center(水平居中)，将justify-content属性设置为space-between（两端对齐）。

5、在浏览器打开test.html文件，查看实现的效果。

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

2、在index.html中的<style>标签中，输入css代码：span {position: absolutetop: 45pxleft: 180px}。

3、浏览器运行index.html页面，此时成功通过css设置了文字在图片上面居中显示。