Bootstrap 3

[basic] BS3 - Well (BS웰 = BS회색상자) ★ - BS회색배경상자 (= BS회색박스 = BS웰클래스)

.well 클래스 의미

 

<div class="well">홈짱닷컴 Homzzang.com</div>

 

결과보기 



1. 모서리가 둥근 오목한 회색 배경 상자
2. 점보트론과 달리, 글자 크기는 안 키움.

 

 

 

.well 크기 클래스


<div class="container">

  <div class="well well-sm">작은 상자</div>

  <div class="well">보통 상자 (기본값)</div>

  <div class="well well-lg">큰 상자</div>

</div>

 

결과보기

 

 

CSS

 

.well {

    min-height: 20px;

    padding: 19px;

    margin-bottom: 20px;

    background-color: #f5f5f5;

    border: 1px solid #e3e3e3;

    border-radius: 4px;

    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);

    box-shadow: inset 0 1px 1px rgba(0,0,0,.05);

}

.well-sm {

    padding: 9px;

    border-radius: 3px;

}

.well-lg {

    padding: 24px;

    border-radius: 6px;

}

 

 


분류 제목
basic BS3 - HOME (소개) - BS3 vs BS4 차이 (= BS차이)
basic BS3 - Start (시작) ★ - BS다운 / BSCDN / BS구문
basic BS3 - Grid (그리드) ★★★ - (BS3그리드 vs BS4그리드)
basic BS3 - Text/Typography(BS글자 = BS텍스트) (= BS4글자 vs BS3글자) BS글자색
basic BS3 - Table (BS테이블) - 테이블테두리 + 테이블배경색 + 반응형테이블
basic BS3 - Image (BS이미지) - 반응형이미지 + 반응형동영상 + 이미지정렬
basic BS3 - Jumbotron/page-header (BS점보트론 / BS페이지헤더) - 큰글씨, 글자키우기
basic BS3 - Well (BS웰 = BS회색상자) ★ - BS회색배경상자 (= BS회색박스 = BS웰클래스)
basic BS3 - Alert (BS경고 = BS얼럿 = BS경보) - 배경색 + 글자색 + 링크색 + 닫기 + 애니…
basic BS3 - Button (BS버튼) ★ - 버튼색깔 + 버튼크기 + 버튼활성화 + 버튼비활성화
basic BS3 - Button Group (BS버튼그룹) ★
basic BS3 - Icon (아이콘) - Glyphicon/Font Awesome/Google Material De…
basic BS3 - Progress Bar (BS진행바 = BS진행상태표시 = BS진도바 = BS프로그레스바) - I…
basic BS3 - Pagination (BS페이징 = BS페이지번호 = BS페이징 = BS패지네이션) + Bread…
basic BS3 - Pager (BS페이저) - 이전페이지/다음페이지 (= 앞으로가기/뒤로가기)
1/4
목록
 홈  PC버전 로그인 일본어
그누앞단언어 1
그누뒷단언어
그외코딩언어
그누보드
제작의뢰
Q&A
커뮤니티 1
웹유틸
회원센터
홈짱닷컴 PC버전 로그인