在html中怎样实现当鼠标放到submit按钮上时使鼠标变为单击文字链接时的图标（即手的形状）？_IT百科

在html文件中添加一个事件，就是当鼠标滑动到submit按钮上时，设置鼠标样式即可，具体例子如下：

<html>

<body>

<p>请把鼠标移动到单词上，可以看到鼠标指针发生变化：</p>

Default</span><br />

Pointer</span><br />

Move</span><br />

e-resize</span><br />

ne-resize</span><br />

nw-resize</span><br />

text</span><br />

wait</span><br />

help</span>

</body>

</html>

首先给input添加一个类，在类里面添加高宽背景等样式即可；代码如下：

<!DOCTYPE html>

<head>

<title>Document</title>

input{border: none}

.bb{width: 100pxheight: 50pxbackground: url(http://pr.bdimg.com/static/princess/img/misc/baidu_logo_c352a179.gif) no-repeat center}

</style>

</head>

<body>

</body>

</html>

作为 CSS Sprite 使用

所有的图标图像都捆绑到一起，并通过 background-position CSS 属性使用。图像文件是 glyphicons-halflings.png，位于 Bootstrap 主文件夹下的 img 文件夹。图标的样式以及背景位置是在 bootstrap.css 的行号 1168 到 1544 中规定。请注意，为避免冲突，所有的图标 class 都以 "icon-" 为前缀。Bootstrap 2.0 中定义了 120 个图标 class。

如何在您自己的站点或 app 中使用图标

下面是在站点或 app 中使用图标的通用语法：

其中 "icon_class_name" 是在 bootstrap.css 中定义的图标 class 的名称（例如：icon-music、icon-star、icon-user 等）。

如果您想要使用白色图标，然后添加一个额外的 icon-white class，如下所示：

如果您想要在使用图标时带上一些字符串，记得在之后添加一些空格。在按钮中使用图标或者一些导航链接中可能会出现这种情况。

实例：一个搜索表单

实例

<!DOCTYPE html>

<head>

<title>使用Bootstrap 版本2.0 中搜索图标的实例</title>

form {

margin-top: 50px

}

</style>

<!--[if lt IE 9]>

<![endif]-->

</head>

<body>

</form>

</div>

</footer>

</div>

</body>

</html>

欢迎分享，转载请注明来源：内存溢出

原文地址:https://54852.com/bake/7921734.html

在html中怎样实现当鼠标放到submit按钮上时使鼠标变为单击文字链接时的图标（即手的形状）？

发表评论

评论列表（0条）