트위터 Bootstrap 스타일의 디스크 만드는 법

1096 단어 CSS
카트입니다.'▼'성격의 물건이지만 트위터 부스트랩에서 CSS로만 구현했기 때문에 노트인 셈이다.트위터 Bootstrap에서dropdown 메뉴를 열거나 닫을 수 있습니다.
<b class="caret"></b>
<style type="text/css">
.caret {
  border-top:   solid 4px #000;
  border-left:  solid 4px transparent;
  border-right: solid 4px transparent;
}
</style>
그게 다야.
캡처:
border-topbottom으로 만들면 위로 향하는 것을 만들 수 있고, 4px물건으로 확대하면 큰 삼각형을 만들 수 있으며, left/right#000로 만들면 탑과 bottomtransparent을 가로로 만들 수 있다.
무슨 원리냐면, 확대해서 색칠을 해보면 알 수 있을 거예요.
  border-top:   solid 80px #000;
  border-left:  solid 80px #0f0;
  border-right: solid 80px #f00;

좋은 웹페이지 즐겨찾기