HTML

Question

我正在使用 jQuery-Mobile 进行开发，我想开发一个方形按钮。

为此，我所做的是用 css 修改它的高度，并且由于我无法修改它的宽度，所以我只是在其中写了一些随机文本，所以它变成了正方形。

此按钮将根据用户交互更改其背景颜色，因此我尝试同时更改文本颜色和背景颜色，以便文本 "disappear"。

但事情是这样的：

如您所见，文本 (mmmmmm) 是可见的，因此：

如何让文字透明？

编辑：

这是代码：

<button id="btn1" data-inline="true">mmmmm</button>

这是 css 阻止我修改宽度的原因：

<script type="text/javascript" src="../jqueryMobile/jquery-1.11.0.js"/></script>
<script type="text/javascript" src="../jqueryMobile/jquery.mobile-1.4.2.min.js"/></script>
<link rel="stylesheet" type="text/css" href="personal.css" />

并且personal.css中唯一的代码

.ui-btn {
  color: rgba(0, 0, 0, 0);
  height: 100px;
  width: 100px;
}

Answer 1

您可以像设置宽度一样设置高度：

.square {
    width: 100px;
    height: 100px;
}

如果您仍然无法设置宽度，因为另一个 css 文件覆盖了它，请尝试使用 !important 字样。这不是好的做法，但它会忽略该元素上的其他宽度声明：

.square {
    width: 100px !important;
}

Answer 2

只需删除文本的阴影。

看到它工作 here。

text-shadow: none;
color: rgba(0, 0, 0, 0);

HTML - 如何在使用 jQuery 移动设备时制作方形普通按钮 css

HTML - How to do a square plain button while using jQuery Mobile css

javascript

css

jquery

jquery-mobile