web-dev-qa-db-ja.com

Bootstrap Button-No Hand Cursor

Visual Studio 2015でMVC6プロジェクトを開発しています。Bowerを使用してBootstrap 3.3.6を追加しました。非常に単純なhtmlページで、ヘッダーのCSSと、本文の下部にあるBootstrapを次のように参照しました。

<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
<script type="text/javascript" src="~/lib/bootstrap/dist/js/bootstrap.min.js"></script>

ボタンを次のように定義しました。

<button class="btn btn-primary">Hello</button>

プロジェクト(IIS、IE11)をデバッグすると、ボタンが表示され、Bootstrapによって明確にスタイル設定されますが、ハンドカーソルがありません。

ブラウザを使用してBootstrapスタイルのボタンの例に移動すると、たとえば、次のようになります。 http://www.w3schools.com/bootstrap/bootstrap_buttons.asp 、ハンドカーソル私が期待するように表示されます。だから私のブラウザのせいではありません。

単純なBootstrapスタイルのボタンからハンドカーソルを取得できない理由を誰かが提案できますか?

8
TDC

代わりにrole='button'を追加してみてください。 bootstrapのドキュメントではtype='button'は機能するはずであると述べていますが、私はしませんでしたが、私はこの問題を抱えていました。

13
Hieu Chu

ボタンタグを取り除き、ブースタークラスでアンカータグを使用する必要があります。例えば:

の代わりに:

<button class="btn btn-primary">Hello </button>

書く:

<a href="#" class="btn btn-primary">Hello </a>

これにより、btn bootsrtapクラスにカーソルを合わせるとHAND CURSORが表示されます

2

ボタンにhref = "#"などのhrefを追加してみてください。

<button class="btn btn-primary" href="#">Hello</button>

ネイティブ要素のタイプとロールの変更を開始すると、これらの要素がユーザーのアクセシビリティとどのように相互作用するかなど、他の副作用があります。詳細については、このMDNリンクを参照してください。 Button Role

1
DanB

フォームが記入されるとその手が現れるのを見るまで、私はあなたにこの手を追加する方法を探していました。 (使用していた

<button type="button"  >

ところで )

0
user1767316

Type = "button"がありません。

bootstrap source less file)には、input [type = "button"]ルールに指定されたcssルールがいくつかあります(バージョン3.3.6で確認

使用する必要はないかもしれませんが、type = "button"と一緒に使用することを目的としています。

W3SchoolとBootstrap buttons demo pageの両方で、type = "button"を使用しています

あなたのコード:

<button class="btn btn-primary">Hello</button>

W3:

<button type="button" class="btn btn-default">Default</button>

Type = "button"(または送信またはリセット)を追加した後も機能しない場合は、インスペクタで要素を調べて、「pointer:cursor」CSSルールをオーバーライドするものを確認してください。

0
Ziv Weissman