Html - a标签如何包裹Div

a标签如何包裹Div?

其实应该将思路转变为将a标签作为一个遮罩来覆盖div。

做法是将a标签放置在该div下,通过将div进行相对定位【position:relative】

将a标签进行绝对定位【position:absolute】 + 层级提升【z-index:199930710】 + 高度宽度和div同步【height:100%;width:100%】

示例代码:

HTML:

<div class="mui-col-xs-10" id="go_set">
    <a href="#set" class="go_ahref">
        <div class="media">
            <div class="media-left">
                <a href="#"><img src="../Images/tab1-1.png" width="60px" alt="" /></a>
            </div>
            <div class="media-body text-left">
                    <h4 class="media-heading">商户收包裹</h4>
                    <p class="media-middle">商户收包裹商户收包裹商户收包裹商户收包裹</p>
            </div>
        </div>
    </a>
</div>    

CSS:

.go_ahref{position: absolute;z-index: 19930710;width: 100%;height: 100%;}
.mui-col-xs-10{position:relative}
时间: 2024-10-08 16:36:53

Html - a标签如何包裹Div的相关文章

解决embed标签显示在div上层【转藏】

解决embed标签显示在div上层,非设置z-index 今天给屌炸了爆笑网增加了视频栏目,但是发现在IE8中,顶部浮动导航的div在移动到embed视频上时,总是被embed的flash文件盖住.分别修改导航div和embed的z-index值仍然无法解决,很是郁闷. 结合之前有过此类遭遇的经验,慢慢摸索了半小时,意识到并非z-index的问题,问题应该是出在embed上,最后Google.百度齐飞,终于找到embed的一个属性“wmode”. 在embed里加入 wmode=”transpa

button标签内部嵌套div时的样式有bug(暂定的解决方案)

button标签内部嵌套div时的样式有bug 暂定解决方案,将button标签改为div标签 <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><style type="text/css">button{padding: 0;}.logo_img{f

a标签内容在div中垂直居中,不兼容低版本浏览器

<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title></title></head> <style>.box{width:100px;height:200px;background:orange;border:2px solid #ccc;display: table;}.box a{dis

png格式的img元素直接设置背景色、border-radius等属性,不需再包裹div造成冗余

原html结构 <div class="user-inform"> <div class="user-img"> <img src="http://coding.imweb.io/img/project/resume/avatar.png" alt="简历头像"> </div> </div> 原css结构 .user-inform .user-img { margin

a标签下的div,在浏览器, 怎么会跑到a标签外面?

编辑的原代码是在a标签里嵌套了div标签,可是在浏览器里面div标签却在a标签外面.导致问题出现的主要原因是:在a标签里面嵌套了a标签(a标签是不能相互嵌套的). 解决办法就是将a标签里嵌套的a标签去除即可.

HTML里为什么不能在&lt;p&gt;标签中嵌套&lt;div&gt;标签

学习过HTML语言的人都应该知道,在HTML里,有分块级元素和内联元素:例如我们常用到的div,o,ul,dl,table,h1...h6等,这些都是块级元素:而像a,b,i,em,img,span等就是内联元素了.在开发过程中,我们避免不了各种元素的嵌套,但是有时候我们在不知不觉中就错误地嵌套元素了.为什么说是不知不觉呢.因为就算我们错误地嵌套了,但是在浏览器中显示的时候,其实是没有区别的.咱们今天就具体地分析为什么不能再<p>里嵌套<div>.希望通过这个例子,大家可以自己去学

Html-Css-div标签嵌套浮动div标签时无法撑开外部div的解决

当DIV1里面嵌套有一个DIV2,当DIV2设置了浮动,那么DIV1是无法被撑开的 当DIV1里面嵌套有一个DIV2,当DIV2设置了浮动,那么DIV1是无法被撑开的,也就是说DIV2在这里相当于浮在了页面上方,跟DIV1不在同一个层面,导致了DIV2无法把DIV1给撑开,这是一个老生常谈的问题,也是困扰很多刚接触DIV+CSS的朋友的一个问题. 先来看看这个问题的实际效果 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional/

html中DIV+CSS与TABLE布局方式的区别及HTML5新加入的结构标签(转)

DIV与TABLE布局的区别 div 和 table 的加载方式不同,div 的加载方式是即读即加载,遇到 <div> 没有遇到 </div> 的时候一样加载 div 中的内容,读多少加载多少:table 的加载方式是完成后加载,遇到 <table> 后,在读</table> 之前,table 中的内容不加载,或者传输中断了的时候加载,这是因为TABLE牵涉到多行多列问题,所以只有当TABLE所有内容加载完毕,浏览器才知道该怎么显示 . div与css配合使

CSS之div和span标签

div和span是非常重要的标签,div的语义是division"分割": span的语义就是span"范围.跨度". 这两个东西,都是最最重要的"盒子". 1                <div> 2                         <h3>中国主要城市</h3> 3                         <ul> 4