[css] 글, 이미지 가운데 정렬 세트 + body 여백 없애기 설정

 [css] 글, 이미지 가운데 정렬 세트 + body 여백 없애기 설정

 

가운데 정렬을 위한 display, direction, content, align 설정

display: flex;
flex-direction: column;
justify-content: center;
align-items: center;

 

body 여백 없애주기

왜? : HTML 태그의 기본적인 여백을 없애줘야 편하기 때문이다.

 

body, h1, h2, h3, h4, h5, h6, p { 
	margin:0; 
    padding:0; 
}

 

밑줄 효과 css 설정

 

.title { 
	text-decoration: underline;
}

 

 

text-decoration 종류

 

underline : 밑줄 긋기

overline : 텍스트의 위에 밑줄 긋기

line-through : 텍스트 가운데 밑줄 긋기(취소 선)

 

 

일부 글의 밑줄 효과 css 설정

 

.title > numbering { 
	text-decoration: underline;
}

일부 글의 밑줄 설정

 

일부 글자만 CSS 적용하기

아래의 예시와 같이 > 세부 클래스 명을 입력하여 일부만 특정 CSS 적용 가능하다.

 

.title > p > span

.title > p