프로그래밍

[Web] day33 : CSS 기초 본문

Web/Web

[Web] day33 : CSS 기초

시케 2023. 7. 4. 08:58
728x90
반응형

2023.06.21.수

CSS 기초

CSS의 기본적인 문법을 알아보자

 

 CSS의 스타일 우선순위

우선순위는 외부 -> 내부 -> 인라인 순으로 증가한다
내부 안에서의 우선순위는 페이지 아래로 내려갈수록 증가

※우선순위를 높이는 키워드가 있다

 

실행화면

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

<style type ="text/css">
	/* 우선순위: 외부 -> 내부 -> 인라인 */
	/* 내부 안에서의 우선순위: 아래로 내려갈 수록 증가 ---> 우선순위를 높이는 키워드가 있음 */
	p {
		color: red;
	}

</style>

</head>
<body>

<!-- 인라인 방식을 적용 -->
<p style="color: blue;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
728x90
반응형

'Web > Web' 카테고리의 다른 글

[Web] day33 : CSS 활용  (0) 2023.07.04
[Web] day33 : CSS 선택자  (0) 2023.07.04
[Web] day32 : radio 버튼  (0) 2023.07.03
[Web] day32 : form 태그  (0) 2023.07.03
[Web] day32 : table 태그를 활용하여 표 만들기  (0) 2023.07.03
'Web/Web' Related Articles more
Comments