Vscodeガイド.ツールバーの
button
ボタンラベルを使用してできることをすべて理解してみましょう.
まずデフォルトのボタンです.
クラスセレクタが適用されていない場合、グレーのウィンドウの各ブロックに表示されるボタンは表示されません.
class=btnのみを指定すると、ボタン機能が純粋なテキストに追加されます.
btn-btn-
色、色の反転、単純なリンク.
input type="button"
この場合、/>で終わるタグ間にテキストは書き込まれません.
value=「ここにボタンテキストを書き込みます.」
aラベルの使用
aタグを使用する場合はrole=「button」でボタンを指定します.
ボタンのプロパティ
まずは今まで
ボタンラベルを使用してできることをすべて理解してみましょう.
まずデフォルトのボタンです.
<h4 class="text-primary"> 버튼 </h4>
<button type="button">클래스 선택자 적용하지 않는 경우 </button>
<button type="button" class="btn">class="btn" 만 적용한 경우 </button>
<hr>
クラスセレクタが適用されていない場合、グレーのウィンドウの各ブロックに表示されるボタンは表示されません.
class=btnのみを指定すると、ボタン機能が純粋なテキストに追加されます.
btn-btn-
<h4 class="text-primary"> button 태그 사용 </h4>
<button type="button" class="btn btn-outline-primary">기본 버튼 모양 </button>
<button type="button" class="btn btn-primary">중요한 버튼</button>
<button type="button" class="btn btn-success">긍정적 의미의 버튼</button>
<button type="button" class="btn btn-info">정보제공 버튼</button>
<button type="button" class="btn btn-warning">주의를 알리는 버튼 </button>
<button type="button" class="btn btn-danger">위험을 나타내는 버튼</button>
<button type="button" class="btn btn-dark">어두운 버튼</button>
<button type="button" class="btn btn-link">단순 링크로 처리하는 버튼</button>
<hr>
色、色の反転、単純なリンク.
input type="button"
<h4 class="text-primary"> input 태그 사용 </h4>
<input type="button" class="btn btn-outline-primary" value="기본 모양 버튼 ">
<input type="button" class="btn btn-primary" value="중요한 버튼 ">
<input type="button" class="btn btn-success" value="긍정적 의미의 버튼">
<input type="button" class="btn btn-info" value="정보제공 버튼">
<input type="button" class="btn btn-warning" value="주의를 알리는 버튼 ">
<input type="button" class="btn btn-danger" value="위험을 나타내는 버튼 ">
<input type="button" class="btn btn-link" value="단순 링크로 처리하는 버튼 ">
<hr>
input type=「button」ボタンも作成できます.この場合、/>で終わるタグ間にテキストは書き込まれません.
value=「ここにボタンテキストを書き込みます.」
aラベルの使用
<h4 class="text-primary"> a 태그 사용 </h4>
<a href="#" class="btn btn-outline-primary" role="button">기본 모양 버튼 </a>
<a href="#" class="btn btn-primary" role="button">중요한 버튼 </a>
<a href="#" class="btn btn-success" role="button">긍정적 의미의 버튼 </a>
<a href="#" class="btn btn-info" role="button">정보제공 버튼 </a>
<a href="#" class="btn btn-warning" role="button">주의를 알리는 버튼</a>
<a href="#" class="btn btn-danger" role="button">위험을 나타내는 버튼 </a>
<a href="#" class="btn btn-link" role="button">단순 링크로 처리하는 버튼 </a>
<hr>
aタグを使用する場合はrole=「button」でボタンを指定します.
ボタンのプロパティ
<p>
<button type="button" class="btn btn-primary btn-lg">큰 버튼 btn-lg</button>
<button type="button" class="btn btn-outline-primary btn-lg">큰 버튼 btn-lg</button>
</p>
<p>
<button type="button" class="btn btn-primary">기본 버튼 </button>
<button type="button" class="btn btn-outline-primary">기본 버튼 </button>
</p>
<p>
<button type="button" class="btn btn-primary btn-sm">작은 버튼 btn-sm</button>
<button type="button" class="btn btn-outline-primary btn-sm">작은 버튼 btn-sm</button>
</p>
<hr>
まずは今まで
Reference
この問題について(Vscodeガイド.ツールバーの), 我々は、より多くの情報をここで見つけました https://velog.io/@nugoory20/VSCode부트스트랩.-버튼テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol