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

html-css011

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

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

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

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

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

实现这个效果

我给你2种方法!

第一

用dl

dt

dd

结构

<dl>

<dt>前面的小图标</dt>

<dd>文字</dd>

</dl>

在写样式控制

第二

给li里面的文字(a标签)定义背景

这个

应该很实用!

结构

<ul

class="style">

<li><a

href="#">

wenzi

</a></li>

</ul>

样式

.style

li

a

{background:url(前面小图片的路径)

no-repeat

3px

3px(定义小图片的位置,可以自己调试);padding-left:10px(要是小图片后面的文字离图片近了可以这样定义);