CSS 색상 선택, 텍스트 정렬, 폰트 글꼴지정

분류없음 RSS Icon ATOM Icon 2022/06/16 11:24 p2p사이트 순위 - 모아파일 2022 TOP12
우리가 웹페이지를 만들때에 텍스트를 가장 많이 사용하게 되는데 이번 내용에서는 텍스트의 색상, 정렬, 폰트, 글꼴지정등의 태그에 대해서 좀더 상세하게 살펴보고자 합니다.


1. 텍스트 컬러지정하기


특정한 텍스트에 컬러를 지정하기 위해서는 목록태그 ul #속성이름을 지정하고 color 컬러를 지정해 볼수가 있습니다. 자주사용하는 색상으로 토마토(tomato), 오랜지(orange), 파란색(blue), 그래이(gray), 그린색(green)등을 각각 지정했습니다.

사용자 삽입 이미지

사용자 삽입 이미지


2. 텍스트를 정렬하기


본문에 p 태그로 문단의 텍스트가 있다면 style 태그에 text-align 태그를 부여하여 left 왼쪽 정렬, right 오른쪽 정렬, center 중앙 정렬, justify 자동정렬로 텍스트를 정렬해 볼수가 있습니다.

사용자 삽입 이미지

사용자 삽입 이미지


3. 폰트 크기, 글꼴, 두꼐, 간격 지정하기


텍스트의 글꼴을 지정하기 위한 태그는 font-size 를 사용하고, 폰트를 지정하기 위해서는 font-family 속성을 사용하고, 폰트를 두껍게 지정하고자 한다면 font-weight 속성이 사용되며 행과 행 사이 간격을 지정하기 위해서는 line-height 속성을 지정합니다.

사용자 삽입 이미지

사용자 삽입 이미지


이상으로 텍스트의 색상, 정렬, 크기, 글꼴, 두께, 간격에 대해서 살펴보았습니다. 폰트의 경우에는 웹브라우저에 없는 폰트일수가 있으므로 여러가지 폰트를 순서대로 지정하여 원하는 폰트나 웹브라우저에 나타날수 있게 합니다.

2022/06/16 11:24 2022/06/16 11:24
받은 트랙백이 없고, 댓글이 없습니다.

댓글+트랙백 RSS :: http://www.weddingamor.co.kr/rss/response/8

댓글+트랙백 ATOM :: http://www.weddingamor.co.kr/atom/response/8