CSS + HTML(조금)

HTML 특성에 대해서 좀더 알아보도록 하겠습니다.

1.<class> vs <id> : 이 둘은 아마 html에서도 많이 보겠지만, css에서 더 많이 보게 될 것입니다. 두 개다 태그에 이름을 주는 역활을 합니다. id는 주민등록번호나, 신체에서는 지문과 같이 세상에 딱 하나만 존재하는 고유한 것에 id를 주는것이라면, class은 이름과 같은 여러개에 동시에 부여하고 싶을 떄 쓰는 것이 class이다. css에서는 id는 # , 클래스는 . 을 붙이고 쓰고 우선순위에서는 id > class 이다.

2.CSS : Cascading Style Sheets의 줄임말로 HTML이 홈페이지의 뼈대를 만든다고 하면 CSS는 여기에 미적인 효과를 준다고 생각할 수 있다.

CSS 스타일을 적용하는 방법은 3가지가 있다.
1)Inline Style : html 태그들에 바로 써버리는 것이다.
<h1 style="color: red;">FRONTEND 101</h1>
이리 하면 빠르긴한데, 일일이 찾아가면서 하는거에서 매우 귀찮고 가독성이 매매우 떨어진다. 그러므로 이렇게 하는것은 추천하지 않는다.
2)<style> 태그를 활용하여 html에 적는것인데, 이렇게하면 html의 길이가 길어지므로 이또한 가독성이 떨어지므로 추천하지 않는다. 그렇다면 추천하는 것은?
3)<css> 파일을 직접 만들어주는것이다.
  <link href="index.css" rel="stylesheet" type="text/css" />

link — link태그로 사용할 css파일을 링크해준다.
2. href — href 속성에 css 파일 경로를 작성합니다.
3. type — link태그로 연결되는 파일이 어떤 것인지 알려줍니다. 여기서 css file을 연결하므로 type값은 항상 "text/css"입니다.
4. rel — rel은 HTML file과 CSS file과의 관계를 설명하는 속성입니다. css파일을 링크할 때는 항상 "stylesheet"값을 대입해줍니다.

css 선언하는 방식은
태그이름 {
	속성 : 속성이름; <- Declaration 선언
 }
 
 p {
 	font-size: 12px;
 }   -> p태그에서 글씨 크기는 12픽셀이다.

font 글씨를 정해줄 수 있는 방법은 3가지가 있다. 
1.hex색상코드 : 6자리로 전달하는 방법 #eb3123
2.rgb : (red green blud)의 비율로 전달하는 방법 rgb(0,0,0)
3.hsl :색상, 채도, 명도(hue, saturation, lightness)로 표현

텍스트를 정렬하는 거에는 왼쪽/오른쪽/중앙 정렬이 있다.
.left {
  text-align: left;
}
.center {
  text-align: center;
}
.right {
  text-align: right;
}
이렇게 클래스 이름을 정하여서 정해주면 필요한 css에 클래스 이름을 넣어주어 편리하게 할 수 있다.

들여쓰기는 text-indent를 통해서~