CSS스타일링3 CSS text-align 텍스트를 정렬하는 속성 Text-align 속성이란? CSS text-align은 텍스트 정렬을 처리하는 속성입니다. 워드프로세스나 문서 편집기에서 흔히 쓰는 좌측, 우측, 가운데 정렬 기능이죠. 제가 사용중인 티스토리 상단 툴바에도 텍스트 정렬 기능이 보이네요. 사용법 h1 { text-align: center; } text-align을 선언합니다 이용 가능한 속성값을 입력합니다 left : 기본값입니다. 왼쪽으로 텍스트를 정렬합니다 right : 오른쪽으로 텍스트를 정렬합니다 center : 가운데에 텍스트를 정렬합니다 justify : 좌우 끝을 맞춰서 텍스트의 간격을 조정합니다 더 자세한 내용은 아래 링크를 참조하세요. https://developer.mozilla.org/en-US/docs/Web/CSS/text-al.. 2023. 7. 18. HTML <div> 태그, 웹 페이지를 구조화하고 스타일을 입히다 DIV태그란? html에서 태그는 정말 많이 쓰이는 중요한 요소입니다. 웹페이지를 구조화하고 레이아웃을 정돈하기도 하고 CSS를 통해 스타일을 입힐 수도 있기 때문입니다. 사용법 인사 안녕하세요! 위의 예시에서 과 만 써도 컨텐츠를 출력하는데는 아무런 문제가 없습니다. 하지만 를 통해서 2개의 구역으로 나누었지요. 이 부분이 바로 웹페이지 구조화입니다. 그럼 스타일을 입히는 예시를 살펴볼께요 예시 코드 See the Pen div by 40's Programmer (@40sProgrammer) on CodePen. 위의 예시는 를 통해 header와 content를 클래스로 나누었어요. header는 메뉴 네비게이션 영역, content는 실제 내용 영역으로 구분된게 보이죠? 각 div에는 다른 이름의 .. 2023. 6. 30. CSS margin 요소 간 간격을 조절하는 속성 MARGIN이란? CSS에서 margin(마진)은 요소들 사이의 간격(여백)을 조절하는 속성입니다. 요소들이라고 하니 생소할 수 있는데요. 텍스트나 그림이나 특정 영역등 HTML 내의 모든 컨텐츠들을 말하는 겁니다. 마진은 가독성 뿐만 아니라 디자인 측면에서도 중요합니다. 사용법 - 기본적인 활용 .my-element { margin: 10px; } margin 뒤에 띄워야 하는 간격값을 넣습니다. px : 가장 일반적인 단위입니다. 고정된 픽셀 값으로 마진을 설정합니다 %(백분율) : 요소가 포함된 컨테이너의 크기에 대해 백분율로 마진을 설정합니다 em : 요소의 폰트 크기 대비 상대적인 크기로 마진을 설정합니다. 부모 요소의 폰트가 기준이 됩니다 rem : 최상위요소 (예를 들면 body에 달린 속성.. 2023. 6. 28. 이전 1 다음
