최신 웹 개발 튜토리얼
 

W3.CSS배지 및 태그


배지 표시

뉴스 (6)

댓글 (8)

업데이트 (9)

<p>News <span class="w3-badge w3-green">6</span></p>
<p>Comments <span class="w3-badge w3-red">8</span></p>
<p>Updates <span class="w3-badge w3-dark-grey">9</span></p>
»그에게 자신을보십시오

태그를 표시

예를 들어 새로운 기능!

댓글 더 나중에!

<p>Example <span class="w3-tag w3-blue">New!</span></p>
<p>Comments <span class="w3-tag w3-teal">More Later!</span></p>
»그에게 자신을보십시오

배지와 목록

  • 5
  • 이브 3
  • 아담 (8)

<ul class="w3-ul w3-border">
  <li>Jill <span class="w3-badge w3-green w3-right">5</span></li>
  <li>Eve <span class="w3-badge w3-green w3-right">3</span></li>
  <li>Adam <span class="w3-badge w3-green w3-right">8</span></li>
</ul>
»그에게 자신을보십시오

대형 태그를 표시

(66)

<span class="w3-tag w3-jumbo w3-padding-large w3-blue">66</span>
»그에게 자신을보십시오

큰 배지를 표시

(66)

<p><span class="w3-badge w3-jumbo w3-padding-large w3-red">66</span></p>
»그에게 자신을보십시오

태그로 표시 편지

U G U S T

<span class="w3-tag w3-black">J</span>
<span class="w3-tag w3-black">A</span>
<span class="w3-tag w3-black">N</span>
<span class="w3-tag w3-black">U</span>
<span class="w3-tag w3-black">A</span>
<span class="w3-tag w3-black">R</span>
<span class="w3-tag w3-black">Y</span>
»그에게 자신을보십시오