gpt4 book ai didi

html - 用jquery在html中覆盖按钮img

转载 作者:行者123 更新时间:2023-11-28 11:21:16 24 4
gpt4 key购买 nike

我在将 bootstrap glyphicon 图像覆盖在背景 img 上并使其作为按钮可点击时遇到问题。

我还为我想显示的其余页面使用了 jquery 模板样式,例如 flipboard 样式页面。

这是html代码,问题是最后一段代码

<body>
<div id="st-container" class="st-container">
<div class="st-pusher">
<nav class="st-menu st-effect" id="menu">
<img src="" style="height:50px;" alt="" />
<ul id="url-list"></ul>
</nav>

<script id="pageTmpl" type="text/x-jquery-tmpl">
<div class="${theClass}" style="${theStyle}">
<div class="front">
<div class="outer">
<div class="content" style="${theContentStyleFront}">
<div class="inner">{{html theContentFront}}</div>
</div>
</div>
</div>
<div class="back">
<div class="outer">
<div class="content" style="${theContentStyleBack}">
<div class="inner">{{html theContentBack}}</div>
</div>
</div>
</div>
</div>
</script>

这是故障代码 - 如果我删除 style="float:left"按钮是可点击的 - 那么问题是我的前页和后页没有重叠,如果添加 style="float:left"那么按钮不可点击,另一方面,img 覆盖了首页和封底。

<div id="st-trigger-effects" style="float:left;">
<button type="button" data-effect="st-effect" class="btn btn-default">
<span class="glyphicon glyphicon-align-justify"></span>
</button>
</div>

我厌倦了另一种变化

<div id="st-trigger-effects" class="imgoverlay">
<button type="button" data-effect="st-effect" class="btn btn-default">
<span class="glyphicon glyphicon-align-justify"></span>
</button>
</div>

css 用于正文

body{
font-family: 'Open Sans Condensed','Arial Narrow', serif;
background: #ddd url(../img/background.jpg) repeat top left;
font-weight: 400;
font-size: 15px;
color: #333;
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
font-smoothing: antialiased;
margin: 0;
overflow: hidden;
}

和css中的overlay类

imgoverlay{
position:absolute;
left:0px;
right:0px;
}

不确定我在这里做错了什么,我还在学习 css/html

最佳答案

缺少指示 imgoverlay 是 css 类的点。

.imgoverlay {
position:absolute;
left:0px;
right:0px;
}

如果没有点,浏览器会查找名为 imgoverlay 的标签。使用点,浏览器会查找任何具有 imgoverlay 类的元素。

关于html - 用jquery在html中覆盖按钮img,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21531532/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com