DIV + CSS 如何实现 超链接 左边图片 右边文字 样式?

就像hao123的这个设置主页的效果... 就像 hao123 的这个设置主页的效果 展开
 我来答
晨曦遇晓style
2013-08-09
知道答主
回答量:1
采纳率:0%
帮助的人:1476
展开全部
<body>
<img src="url"/>

<a href="">

设为主页

</a>
</body>
就这么简单,其实不需要div也是可以的,不过你是嵌套在别的div里的话就需要进行设置了,希望能帮助你!
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
222傻猪
推荐于2017-09-14 · TA获得超过1111个赞
知道小有建树答主
回答量:348
采纳率:66%
帮助的人:217万
展开全部
你把图片设为背景图片。比如p标签,

<p> <a href=“”>设为主页</a></p>

.top{
background:url(背景图片路径) no-repeat left center;
padding-left: 15px; /*15px是小图片的宽度,你看看效果自己调*/
}
追问

按照你的方法, 成功了, 正常显示:

但是当鼠标移动到这方面, 图片就消失了: 

追答
鼠标移动上去怎么会消失呢,你用下面的代码运行,看看问题出在哪里了。

hao123

.header{
width: 960px; /*这个div根据你写的替换就行了*/
height: 40px;
margin: 5px auto;
background-color: yellow; /*没用你去掉就行*/
}
.header p{
display: block;
width: auto;
line-height: 14px;
background: url("sethome.png") no-repeat left center; /*你的图标路径*/
padding-left: 20px;
}
.header p a{
text-align: left;
text-decoration: underline;
color: red;
font-size: 12px;
}

设为主页

本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
dreamonly0
2013-08-09
知道答主
回答量:58
采纳率:0%
帮助的人:20.5万
展开全部
<span><img src="" alt=‘map dead'>dsadsad</span>
教你个办法,不会的就在那个上面点击右键,查看元素。里面的就是源码
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
回忆526
推荐于2017-09-15 · TA获得超过4165个赞
知道大有可为答主
回答量:3276
采纳率:87%
帮助的人:1906万
展开全部
DIV + CSS 实现超链接左边图片右边文字样式,首先我们需要设置好3个div,然后用一个a标签包裹着其他2个div,在里面设置好宽度和高度,在通过css的float属性来实现对2个div左右对齐操作,具体看代码:
<html>
<head>
<style>
#div2{
widht:220px;
height:300px;
font-size:13px;
}

#div3{
width:100px;
height:80px;
flaot:left;
margin-left:20px;
}

#div4{
width:100px;
height:80px;
flaot:left;
}
</style>
</head>

<body>
<div id='div2'>
<div id='div3'>
<img src='图片地址'>
</div>
<div id='div4'>
<p>我是测试文字</p>
</div>

</div>

</body>
</html>
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式