본문 바로가기

전체 글21

[CSS 기본] CSS 박스 모델 (1) 블록 레벨 요소 VS 인라인 레벨 요소 블록 레벨(block-level) 요소 - 태그를 사용해 요소를 삽입했을 때 요소의 너비가 100% - , 태그 등 인라인 레벨(inline-level) 요소 - 한 줄에 여러 개의 인라인 레벨 요소를 표시 - , 태그 등 블록 레벨 태그 , ~, , , , , , , , , 인라인 레벨 태그 , , , , , , , , , 2021. 11. 14.
[CSS 기본] 목록 스타일 list-style-type 목록 스타일 지정 list-style-type: none | | ▼ 불릿 모양 바꾸기 속성 값 설명 disc 채운 원 circle 빈 원 square 채운 사각형 none 불릿 없애기 ▼ 순서 목록 숫자 바꾸기 속성 값 설명 decimal 1로 시작하는 십진수 decimal-leading-zero 앞에 0이 붙는 십진수 lower-roman 소문자 로마 숫자 upper-roman 대문자 로마 숫자 lower-alpha / lower-latin 소문자 알파벳 upper-alpha / upper-latin 대문자 알파벳 list-style-image 불릿 대신 이미지 list-style-image: url(이미지 파일 경로) | none list-style-position 목록 .. 2021. 11. 14.
[CSS 기본] 문단 스타일 direction 글자 쓰기 방향 지정 direction: ltr | rtl 속성 값 설명 ltr (lef-to-right) 왼쪽에서 오른쪽으로 텍스트 표시. 기본값 rtl (right-to-left) 오른쪽에서 왼쪽으로 텍스트 표시 * 한글이나 영어처럼 왼쪽에서 오른쪽으로 쓰는 언어일 경우, 속성값이 rtl이더라도 방향이 바뀌지 않고 오른쪽 정렬된다. text-align 텍스트 정렬 text-align: start | end | left | right | center | justify | match-parent 속성 값 설명 start 현재 텍스트 줄의 시작 위치에 맞추어 문단 정렬 end 현재 텍스트 줄의 끝 위치에 맞추어 문단 정렬 left 왼쪽 정렬 right 오른쪽 정렬 center 가운데 정렬.. 2021. 11. 14.
[CSS 기본] 텍스트 관련 스타일 (2) [프로그래밍/HTML & CSS] - [CSS 기본] 텍스트 관련 스타일 (1) color 글자 색 지정 text-decoration 텍스트에 줄 표시/제거 text-decoration: none | underline | overline | line-through 속성 값 설명 none 밑줄 표시 X underline 밑줄 표시 overline 영역 위로 선 그리기 line-through 취소선 그리기 text-transform 텍스트 대/소문자 변환 text-transform: none | capitalize | uppercase | lowercase | full-width 속성 값 설명 none 변환 X capitalize 첫 번 째 글자를 대문자로 변환 uppercase 모든 글자를 대문자로 변환 .. 2021. 11. 14.

티스토리툴바