"부트스트랩3 .well"의 두 판 사이의 차이

2020년 11월 2일 (월) 02:52 기준 최신판

1 개요[ | ]

부트스트랩 .well 클래스

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/latest/js/bootstrap.min.js"></script>

<div class="well">기본 Well</div>
<div class="well well-sm">작은 Well</div>
<div class="well well-lg">큰 Well</div>

2 CSS[ | ]

.well {
    min-height: 20px;
    padding: 19px;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
}

3 같이 보기[ | ]

4 참고[ | ]

http://www.w3schools.com/bootstrap/bootstrap_wells.asp

@@ 1번째 줄: / 1번째 줄: @@
 ==개요==
-;부트스트랩 .well
+;부트스트랩 .well 클래스
-<source lang='html5'>
+<syntaxhighlight lang='html5'>
 <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">
 <script src="//code.jquery.com/jquery.min.js"></script>
@@ 10번째 줄: / 10번째 줄: @@
 <div class="well well-sm">작은 Well</div>
 <div class="well well-lg">큰 Well</div>
-</source>
+</syntaxhighlight>
 <jsfiddle height='300'>t282rrzv</jsfiddle>
+==CSS==
+<syntaxhighlight lang='css'>
+.well {
+    min-height: 20px;
+    padding: 19px;
+    margin-bottom: 20px;
+    background-color: #f5f5f5;
+    border: 1px solid #e3e3e3;
+    border-radius: 4px;
+    box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
+}
+</syntaxhighlight>
 ==같이 보기==
-*[[HTML div 태그]]
+* [[부트스트랩4 .alert]]
+* [[부트스트랩4 .card]]
+* [[CSS 부트스트랩 .well]]
+* [[부트스트랩 폼]]
+* [[머티리얼라이즈 card-panel]]
+* [[HTML div 태그]]
+==참고==
+*http://www.w3schools.com/bootstrap/bootstrap_wells.asp
 [[분류: Bootstrap]]