୧((〃•̀ꇴ•〃))૭⁺✧
2020-08-14 09:20
采纳率: 86.8%
浏览 986

如何给一个div右上角加一个删除图标

图片说明

<div class="layui-fluid layadmin-maillist-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md4 layui-col-sm6">
            <div class="layadmin-contact-box">
                <div class="layui-col-md4 layui-col-sm6">
                    <a href="javascript:;">
                        <div class="layadmin-text-center">
                            <img src="../../layuiadmin/style/res/template/character.jpg">
                            <div class="layadmin-maillist-img layadmin-font-blod">演员</div>
                        </div>
                    </a>
                </div>

                <div class="layui-col-md8 layadmin-padding-left20 layui-col-sm6">
                    <a href="javascript:;">
                        <h3 class="layadmin-title">
                            <strong>胡歌</strong>
                        </h3>
                        <p class="layadmin-textimg">
                            <i class="layui-icon layui-icon-location"></i>
                            上海
                        </p>
                    </a>
                    <div class="layadmin-address">
                        <a href="javascript:;">
                            <strong>Hu Ge studio</strong>
                            <br>
                            E-mail:xxx@baidu.com
                            <br>
                            Weibo: https://weibo.com/hu_ge
                            <br>
                            <addr title="phone">Tel:</addr>
                            (123) 456-7890
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

整个HTML是这样的,如何在右上角添加一个删除图标,在线等。。

  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • _hsc 2020-08-14 10:34
    已采纳

    把下面“删除”2个字替换成你的删除图片

    <div class="layui-fluid layadmin-maillist-fluid">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md4 layui-col-sm6" style="position:relative;">
                <div class="layadmin-contact-box">
                    <div class="layui-col-md4 layui-col-sm6">
                        <a href="javascript:;">
                            <div class="layadmin-text-center">
                                <img src="../../layuiadmin/style/res/template/character.jpg">
                                <div class="layadmin-maillist-img layadmin-font-blod">演员</div>
                            </div>
                        </a>
                    </div>
    
                    <div class="layui-col-md8 layadmin-padding-left20 layui-col-sm6">
                        <a href="javascript:;">
                            <h3 class="layadmin-title">
                                <strong>胡歌</strong>
                            </h3>
                            <p class="layadmin-textimg">
                                <i class="layui-icon layui-icon-location"></i>
                                上海
                            </p>
                        </a>
                        <div class="layadmin-address">
                            <a href="javascript:;">
                                <strong>Hu Ge studio</strong>
                                <br>
                                E-mail:xxx@baidu.com
                                <br>
                                Weibo: https://weibo.com/hu_ge
                                <br>
                                <addr title="phone">Tel:</addr>
                                (123) 456-7890
                            </a>
                        </div>
                    </div>
                </div>
                <div style="position:absolute;top:10px;right:10px">删除</div>
            </div>
        </div>
    
    </div>
    
    打赏 评论

相关推荐 更多相似问题