Frontend/css (3) 썸네일형 리스트형 CSS 활용 2편 (CSS 태그 배치) 지난글에 이은 CSS 활용 2탄이다. 목차 1. CSS 박스 유형 제어 display 2. CSS 박스 위치 지정 position 3. 기타 1. CSS 박스 유형 제어 display html의 태그는 블록 태그와 인라인 태그로 나뉜다. 대표적으로는 블록 박스, 은 인라인 박스를 출력한다. display 프로퍼티로 박스 유형을 설정할 수 있다. 블록 박스 display : block 인라인 박스 display : inline 인라인 블록 박스 display : inline-block 항상 새 라인에서 시작 새 라인에서 시작 못하고 라인 내에 위치 새 라인에서 시작 못하고 라인 내에 위치 블록 박스 내에만 배치 모든 박스 내 배치 가능 모든 박스 내 배치 가능 옆에 다른 요소 배치 불가능 옆에 다른 요소 .. CSS 활용 1편 CSS로 적용할 수 있는 스타일에 대해 정리했다. CSS 적용 방법이 어려우면 이전글을 참고하면 된다. 목차 1. CSS 색 표현 2. CSS 텍스트 스타일 3. CSS 단위 4. CSS 폰트 5. CSS div 박스 모델 6. CSS 배경 다루기 7. CSS 텍스트 그림자 / CSS 박스 그림자 8. CSS 마우스 커서 제어 1. CSS 색 표현 CSS로 색 적용 시킬 수 있는 프로퍼티(속성)는 3가지가 있다. 1. color (텍스트) 2. background-color (배경 ) 3. border-color (테두리) 색 적용 방법 1. 색 이름 2. 16진수 3. rgb 2. CSS 텍스트 스타일 1. 들여쓰기 text-indent : (단위나 퍼센트로) 2. 정렬 text-align : (lef.. CSS와 셀렉터(Selector) html 파일에 CSS를 적용하는 방법에 대해서만 다루고 있다. 구체적인 CSS 태그나 속성들에 대해서는 다음글을 참고하면 된다🤭 CSS 적용하기 1. 태그 CSS / 셀렉터 예제 Hello World 중첩된 style frontend study HTML5 CSS JAVASCRIPT backend는 더 어렵다 external.css body{margin-left: 30px; margin-right: 30px;} p{background-color: pink;} 결과 CSS를 더 공부하고 싶다면 아래 게시글을 참고하자 CSS 활용 기본 CSS로 적용할 수 있는 스타일에 대해 정리했다. CSS 적용 방법이 어려우면 이전글을 참고하면 되고, CSS 활용 고급은 다음글로 작성 예정이다!! 목차 1. CSS 색 표.. 이전 1 다음
