<!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) 네이비색 */
}
나는 DIV1
나는 DIV2
'HTML,CSS' 카테고리의 다른 글
ch02 _3 (0) | 2022.07.31 |
---|---|
ch02 - display (0) | 2022.07.31 |
ch02 - display(block, inline) (0) | 2022.07.31 |