HTML, CSS

(19)CSS_외부스타일

빠스무 2023. 3. 29. 17:39
728x90
 

(15)CSS_기본 문법

CSS(Cascading Style Sheets) 웹 페이지의 특정 요소 또는 그룹에 적용할 스타일 그룹을 지정하는 규칙을 정의하는 언어 ✔ 참고 MDN: https://developer.mozilla.org/ko/ MDN Web Docs The MDN Web Docs site provides information a

jm-rograming.tistory.com

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>외부 스타일</title>
    <link rel="stylesheet" href="css/css.css">
</head>
<body>
    <h2>CSS를 적용하는 방법</h2>
    <ul>
        <li>인라인 스타일</li>
        <li>내부 스타일</li>
        <li>외부 스타일</li>
    </ul>
</body>
</html>

 

  • css.css를 만들고 그 안에서 css 스타일을 설정해준다.
/*
    css.css
    작성일: 2023-03-28
    작성자: JM
    내용 외부 스타일 적용 방법
*/

h2{
    font-size: 50px; /* h2 요소의 사이즈를 50px 로 설정*/
}

ul{
    list-style: none;
}

li{
    display: inline-block; margin-right: 50px;
    font-weight: bold;
    color: deeppink;
 }