HTML,CSS

ch01

에어팟맥스 2022. 7. 31. 20:47
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>css(Cascading Style Sheet)의 우선순위에 대해서 알아본다.</title>

<link rel="stylesheet" href = "mycss.css">

<style type="text/css"> /* 디자인처리를 해주는 곳 */
/*
   === CSS(Cascading Style Sheets) 우선순위 ===
   !important(css 강제적용) > 해당 태그에 직접준것(인라인방식) > HTML 파일에서 준 style 태그(임베디드방식) > 외부에 있는 .css 파일을 로드 한것(예: <link rel="stylesheet" href="mycss.css" >)
*/

   div {
   	border: solid 1px blue;  /* 테두리 : 실선 두께(1px) 파란색 */
   	background-color: #ece6ff !important;  /* 배경색: 연보라색 */
   	
   	color: red;  /* 글자색 */
   }

</style>

<!-- 블록을 잡고 주석문 ctrl+shift+/ -->
</head>
<body>
<!-- HTML의 주석문  -->
	<div style="border: ridge 3px #00cccc; background-color: #ccffff">나는 DIV1</div>
	<div>나는 DIV2</div>
</body>
</html>

링크 href = "mycss.css"

@charset "UTF-8";

div{
	border: solid 3px navy !important;  /* 테두리 : 실선 두께(3px) 네이비색 */
}
css(Cascading Style Sheet)의 우선순위에 대해서 알아본다.
나는 DIV1
나는 DIV2

'HTML,CSS' 카테고리의 다른 글

ch02 _3  (0) 2022.07.31
ch02 - display  (0) 2022.07.31
ch02 - display(block, inline)  (0) 2022.07.31