[대구AI스쿨] TIL 210631
Today I Learned
CSS 속성 적용하는 방법
<h1 style="background-color: pink;">Hello World</h1>
<h1 style="background-color: pink;">Hello World</h1>태그 안에 style 속성을 사용하여 직접 CSS 속성을 적용시키거나
<head>
<meta charset="utf-8">
<style>h1 {color: red;}</style>
</head>head 태그 안에 style 태그를 사용하여 CSS 속성을 적용시키거나
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="style.css">
</head>head 태그 안에 link 태그를 사용하여 따로 생성한 CSS 파일을 연동시켜 CSS 속성을 적용시키는 방법이 있다. 코드의 간결성을 위해 실무에서는 link 태그를 사용하는 것이 일반적이다.
CSS 속성의 상속
<header>
<div>
<h2>header h2</h2>
<p>header p</p>
</div>
</header>예를 들어 header 태그는 div의 부모 태그이고 div는 header의 자식 태그이다. 자식 태그는 부모 태그의 CSS 속성을 상속받는다.
캐스케이딩
style 속성 > id > class > tag
하나의 태그에 여러가지 CSS 속성이 적용되어있다면 위의 순서대로 CSS 속성이 적용된다.
id 선택자와 class 선택자의 차이
id = 이름
id 선택자는 하나의 문서 안에서는 똑같은 id 값을 가질 수없다. #로 id선택자를 사용한다.
class = 별명
class는 id 선택자와 달리 여러가지 class 값을 가질 수 있다. 배경색, 폰트사이즈, 폰트 색상 등 개발자의 필요에 따라 다양한 class 선택자를 만들어 사용할 수 있다.
Summary
CSS 속성을 적용시키는 방법과 적용 규칙에 대해 알게 되었다. CSS 부분도 예전에 공부한 적이 없어서 딱히 어려운 점은 없었다.
Author And Source
이 문제에 관하여([대구AI스쿨] TIL 210631), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@pyeonne/대구AI스쿨-TIL-210631저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
