Question

我有一个像我这样的按钮。

<button type="submit" class="search-btn" id="search-submit-header"></button>

它具有某些我希望应用于此范围的功能，以便它与按钮完成相同的工作。我想使用跨度的CSS。

<span class="search-btn">
    <a href="#"><i class="fa fa-search"></i></a>
</span>

我怎样才能得到这个。即在跨度上工作的按钮的功能。

为一个愚蠢的问题道歉。

Answer 1

只需将样式信息添加到锚标记即可。例如，检查以下行

<a href="#" class="search-btn">
    <i class="fa fa-search"></i>
</a>

注意：清除锚标记的所有样式信息并编写支持javascript代码

   function doSomething(){
     //your code
    }
   $('.search-btn').click(doSomething);

Answer 2

尝试这样的事情

<!DOCTYPE html>
<html>

<body>
    <style>
        .ButtonSpan {
            /*width: 500px;
            height: 500px;*/
            border: 1px solid black;
            background: #e0e0e0;
            padding: 25px;
        }
    </style>
    <button type="submit" class="ButtonSpan">test</button>
    <span class="ButtonSpan">test</span>

</body>

</html>

Answer 3

查找css元素当前应用的<button>。

有几种方法可以做到，但最简单的方法是（在chrome中）你可以右键单击＆gt;检查元素＆gt;按＆＃34; ctrl + shift + c＆＃34;并点击按钮＆gt;元素标签＆gt;计算选项卡（在RHS上）并查看当前应用的css。

从那里复制css的主要属性并将其应用于css中的span.search-btn类。

例如：

span.search-btn {
    width: 20px;
    height: 10px;
    border: 1px solid black;
    padding: 20px;
}

在html中创建一个类似于span的按钮

3 个答案: