최신 웹 개발 튜토리얼
 

W3.CSS표지판


징후를 표시

약간의 상상력과 W3 태그 및 W3-배지 클래스는 표지판의 모든 종류를 표시하는 데 사용할 수 있습니다.


표시로 태그를 표시

런던 동물원 (London Zoo)

<div class="w3-tag w3-orange">London Zoo</div>
»그에게 자신을보십시오

행에 태그를 표시

에스
에이
이자형

<div class="w3-tag w3-red">S</div>
<div class="w3-tag w3-black" >A</div>
<div class="w3-tag w3-yellow">L</div>
<div class="w3-tag w3-black">E</div>
»그에게 자신을보십시오

도로 표지판 표시

팔콘 릿지 파크 웨이

<div class="w3-tag w3-round w3-green" style="padding:3px">
<div class="w3-tag w3-round w3-green w3-border w3-border-white">
Falcon Ridge Parkway
</div>
</div>
»그에게 자신을보십시오

대형 표지판 표시

경우
비상 사태
RUN LIKE 지옥!

<span class="w3-tag w3-xxlarge w3-padding w3-orange w3-center">
IN CASE OF<br>
EMERGENCY<br>
RUN LIKE HELL !
</span>
»그에게 자신을보십시오
49, 99

<div class="w3-tag w3-jumbo w3-green">
  <span class="w3-xxlarge">49</span>
  <span class="w3-large">,99</span>
</div>
»그에게 자신을보십시오

둥근 징후를 표시

하지 마라

물에서

<span class="w3-tag w3-xxlarge w3-padding w3-round-large w3-red w3-center">
DO NOT<br>
BREATHE<br>
UNDER WATER
</span>
»그에게 자신을보십시오

플래그를 표시

<div class="w3-display-container w3-white w3-border w3-card-8" style="height:200px;width:350px">
<div class="w3-display-topleft w3-container w3-red" style="width:25%;height:40%"><p></p></div>
<div class="w3-display-topright w3-container w3-red" style="width:60%;height:40%"><p></p></div>
<div class="w3-display-bottomleft w3-container w3-red" style="width:25%;height:40%"><p></p></div>
<div class="w3-display-bottomright w3-container w3-red" style="width:60%;height:40%"><p></p></div>
</div>
»그에게 자신을보십시오