본문 바로가기 메뉴 바로가기

개발자 퉁이리

프로필사진
  • 글쓰기
  • 관리
  • 태그
  • 방명록
  • RSS

개발자 퉁이리

검색하기 폼
  • 분류 전체보기 (575)
    • 회고 (3)
    • 백준 온라인 저지 [BOJ] (276)
      • JAVA [자바] (20)
      • C++ [CPP] (149)
      • PYTHON [파이썬] (104)
      • JAVASCRIPT [JS] (1)
    • 프로그래머스 (35)
      • C++ [CPP] (9)
      • PYTHON [파이썬] (26)
    • 쉽게 배우는 자바 프로그래밍 (103)
      • 연습문제 (13)
      • 2장 (9)
      • 3장 (10)
      • 4장 (8)
      • 5장 (8)
      • 6장 (6)
      • 7장 (7)
      • 9장 (8)
      • 11장 (8)
      • 12장 (7)
      • 14장 (8)
      • 15장 (5)
      • 16장 (6)
    • FRONT-END (10)
    • BACK-END (1)
    • 데이터베이스 (26)
    • 운영체제 (30)
    • 알고리즘 (0)
    • 자료구조 (6)
    • Git (1)
    • WEB (80)
      • HTML (4)
      • CSS (6)
      • 자바스크립트 (43)
      • 타입스크립트 (3)
      • etc (24)
    • 명품 C++ Programming (4)
  • 방명록

박스 (1)
[CSS] Box Model (박스 모델)

CSS 박스 모델 모든 HTML 요소는 박스 모양으로 구성되고 네 영역으로 이루어진다. 박스 모델은 Chrome 기준 F12를 누르면 Element Style 부분에서 바로 만나볼 수 있다. 네 가지 영역 내용 패딩 테두리 마진 1️⃣ 내용 텍스트나 이미지 등의 내용이 표시되는 영역이다. 폭과 높이로 크기를 지정할 수 있다. width:111px; height:111px; 2️⃣ 패딩 콘텐츠 내용과 테두리 사이의 여백 영역이다. 패딩은 눈에 보이지 않고, 마이너스 값의 지정도 가능하다. padding: 11px 11px 11px 11px; padding-top:11px; padding-bottom:11px; 3️⃣ 테두리 패딩과 마진의 경계에 있는 테두리이다. 테두리의 두께와 색상 등의 설정이 가능하다...

WEB/CSS 2021. 11. 8. 04:39
이전 1 다음
이전 다음
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG
  • 자바
  • 쉽게 배우는 자바 프로그래밍
  • 구현
  • 연습문제
  • 운영체제
  • 쉽게배우는
  • 정답
  • 프로그래머스
  • Web
  • BFS
  • CPP
  • 답
  • C++
  • 백준
  • 알고리즘
  • Python
  • 우종정
  • 파이썬
  • 풀이
  • OS
  • 그리디
  • 자바스크립트
  • 정리
  • 해답
  • 문자열
  • JS
  • py
  • 쉽게배우는자바프로그래밍
  • 정렬
  • java
more
«   2025/04   »
일 월 화 수 목 금 토
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30
글 보관함

Blog is powered by Tistory / Designed by Tistory

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.