TIL) HTML/CSS - 기본적인 웹페이지 스타일링

이미지 가운데 정렬

display: block;
margin-left: auto;
margin-right: auto;

자주 사용하는 글자 스타일들

font-size : px; // 사이즈
font-family : 'font-name'; // 폰트 종류
color : color; // 폰트 색깔
letter-spacing : px; // 자간 조절
text-align : left, center, right; // 글자 정렬
font-weight : ; // 폰트 두께

@ 일부 글자만 스타일링 하고 싶을 땐 <span> 태그 사용한다.
<span> 태그는 글자를 감쌀 수 있는 큰 의미가 없는 태그다.
<strong> 태그로 간단히 굵게 표현도 가능하다.

이미지 정렬과 폭 조정

display : block;
margin-left : auto;
margin-right : auto;
width : 150px;

CSS파일 연결하기

<link href="폴더이름/파일명.css" rel="stylesheet">

css 파일에 style 코드 옮겨담고 class 이름 정하기.
html 파일에는 style 코드를 지우고 class="이름" 적어주기.

CSS selector

• 클래스 selector
  .클래스명{} 이렇게 적고 모든 class="클래스명" 속성을 가진 요소에 스타일을 적용할 수 있다.
• 아이디 selector
  #아이디명{} 이렇게 적고 모든 id="아이디명" 속성을 가진 요소에 스타일을 적용할 수 있다.
• 태그 selector
  p{스타일~} 이렇게 적고 모든 <p> 태그에 스타일을 적용할 수 있다.

selector의 우선순위

style="" > #id > .class > p