html 정리 -1

html = Hypertext Markup Language의 약자.

즉, 자료의 구조를 표현하기 위한 단어.

그러니까 웹 서핑을 할 때, html의 구조를 보고 웹 사이트 구글이나 네이버가 글의 품질을 결정하는 것도 이해가 됨.

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  
</body>
</html>

html의 기본 구조.

태그에 대한 스타일을 정의할 수 있음.

ex> <p style="font-size : 15px;" <-- 폰트 사이즈를 15픽셀로 지정 가능.

폰트 사이즈, 폰트명, 컬러, 자간, 텍스트 정렬 방식, 폰트 굵기 등을 스타일로 지정할 수 있음.

이미지도 마찬가지.

margin-left : auto; margin-right : auto;로 설정하게 되면 이미지를 중앙 정렬하게 됨.

더러운 스타일을 css파일 로 저장해서 불러오기.

이렇게 불러올 수 있다.

그리고 클래스명, 셀렉터, 아이디 등으로 불러올 수 있다.

class = .파일명 { 중괄호 안에 스타일 넣기}

id = #파일명 {중괄호 안에 스타일}

tag = p {중괄호 안에 스타일} <여기서 p나 h1 같은 전체적으로 사용하는 태그에 관한 속성을 지정할 수 있다.

css 셀렉터의 점수

1. 스타일 (그냥 html에서 직접 스타일을 지정하면 그게 적용됨)

2. 아이디

3. 클래스

4. 그냥 태그

인강 시청하면서 대충 정리한 내용입니다.

나중에 다시 보면서 기억 떠올리게 하려는 거라 그리 자세하게 하나하나 설명하진 않았습니다.

자기계발 역량을 올리기 위해 html 및 css 공부 시작(코딩애플 인강) (1)	2022.09.11

댓글