0

如何将图像分配给按钮并使其值消失,以便仅图像出现在屏幕上。我正在使用 PHP 和 HTML5。

以下代码有效,图像出现但与图像一起,按钮的值也显示在屏幕上。我无法删除 value 属性,因为我需要它来查找所显示项目的 ID。

PHP 代码(将 td 插入动态表)

<?php $url = get_template_directory_uri().'/images/deleteButton1.png'; ?>
<td class='delete'><button id="gm_btn_delete_order_prod"  value="{$product_id}"     class="button"></button></td>

CSS

.button
        {
        background: url(<?php echo $url; ?>) no-repeat;
        cursor:pointer;
                    border: none;
        }
4

3 回答 3

2

您可以使用 CSS 将文本移动到页面外的某个位置,例如:

.button {
   text-indent: -10000px;
}

根据特里的评论,可以执行以下操作:

.button {
   text-indent: 100%;
   white-space: nowrap;
   overflow: hidden;
}
于 2013-11-07T21:01:48.597 回答
1

您可以在按钮上使用 data-value 属性来存储您需要的值,然后使用 jquery 将其拉出。

于 2013-11-07T21:02:54.483 回答
0

您可以使用链接而不是按钮并通过GET或使用 javascript传递参数POST/PUT 使用本教程制作带有链接的漂亮图像按钮或仅按钮/输入提交http://www.oscaralexander.com/tutorials/how-to-make-sexy -buttons-with-css.html

更新 我现在正在一个具有图像按钮的网站上工作,代码:

css

input[type="submit"] {
position: absolute;
width: 122px;
height: 33px;
margin: 382px 0 0 500px;
border: 0 none;
background: none;
background-image: url(/images/asset/form.png);
background-position: -678px -525px;
z-index: 2;
}

html

<input type="submit" value="">
于 2013-11-07T21:04:32.247 回答