[CSS] ch01-04.Class (클래스)

2017. 8. 22. 17:38·WEB/CSS
728x90
반응형

04_class.html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>요안도라</title>
<style>
    @import "../css/04_class.css";
</style>
</head>

<body>
    <section>
        <h2>요안도라 소개</h2>
        <h3>¤ 요안도라는 게스트 하우스(Guest House) 형식의 농어촌 민박입니다</h3>
        <p class="accent">성산의 날씨는 다음주 내내 높은 구름에 햇살 가득이라고 합니다.</p>
        <p>목요일이면 섭씨 27도까지 오른다고 하지만, </p>
        <p>늘 부는 바람이 쾌적한 균형을 잡아 마당에 마당에 나가 앉아 있는 시간이 많아질듯 합니다.</p>
        <p>
            오늘은 사진에 보이는 긴 돌담을 따라 들어오는 <span class="accent">요안도레 올레 입구</span>에
            특곤색의 대문을 달았습니다.
        </p>
    </section>
</body>
</html>

 

04_class.css

@CHARSET "UTF-8";
p{ /*tag selecter*/
    font-size: 12px;/*글자크기 12px*/
    margin-left: 20px;/*왼쪽여백 20px*/
}
.accent{ /*class selecter*/
    color: blue;/*글자색 파랑*/
    font-weight:bold;/*글자 굵기(bold)*/
}

728x90
반응형

'WEB > CSS' 카테고리의 다른 글

[CSS] ch01-06. descendant  (0) 2017.08.22
[CSS] ch01-05. ID  (0) 2017.08.22
[CSS] ch01-03. 각종 태그 (tag)  (0) 2017.08.22
[CSS] ch01-02. 리스트 스타일 (list style)  (0) 2017.08.22
[CSS] ch01-01. 폰트 컬러, 배경 컬러  (0) 2017.08.22
'WEB/CSS' 카테고리의 다른 글
  • [CSS] ch01-06. descendant
  • [CSS] ch01-05. ID
  • [CSS] ch01-03. 각종 태그 (tag)
  • [CSS] ch01-02. 리스트 스타일 (list style)
밍글링글링
밍글링글링
mingling - 밍글링, 밍글밍글링. 코드와 어우러지다. IT/ 프로그래밍/소스
    반응형
    250x250
  • 밍글링글링
    mingling
    밍글링글링
  • 전체
    오늘
    어제
    • 밍글링글링 (463)
      • Flutter (2)
      • 일상생활 (8)
        • 리뷰 (1)
        • 생활정보 (4)
        • 맛집 (0)
        • 여행 (0)
        • 모든정보 (3)
      • JAVA (126)
        • 개념 (6)
        • 예제 (115)
        • Exception (2)
      • C (1)
        • C (1)
        • C++ (0)
        • C# (0)
      • JS (29)
        • JavaScript (18)
        • JQuery (5)
        • AJax (0)
        • NODE.JS (6)
        • Angular.JS 2.0 (0)
      • WEB (87)
        • HTML (6)
        • CSS (61)
        • JSP (20)
        • JSTL (0)
      • FrameWork (8)
        • Spring (8)
        • BootStrap (0)
        • MyBATIS (0)
        • JUnit (0)
      • 외부 라이브러리 (5)
      • 공유 소스 관리 (5)
        • Git (5)
        • SVN (0)
      • 빅데이터 프로그래밍 (37)
        • Python (37)
        • R Programming (0)
      • DB (7)
        • ORACLE (0)
        • MySql (6)
      • Development Tools (7)
        • StarUML (0)
        • eXERD (0)
        • Eclipse (4)
      • SKILL (6)
        • Migration (0)
        • Security (6)
      • MicroSoft (0)
        • Excel (0)
        • Word (0)
      • Android (0)
      • Server (21)
        • Ubuntu (5)
        • Linux (15)
      • IOS (0)
      • XML (0)
      • 미디어 (0)
      • 공지사항 (3)
      • NETWORK (1)
      • 게임 (4)
        • 피파 (1)
        • 리니지M (0)
        • 배틀그라운드 (1)
        • 듀랑고 (2)
      • 세상 이슈 (6)
      • 일렉트론 (0)
      • 대회 소식 (4)
      • 업무 (2)
      • Express, Vue (6)
      • docker (11)
      • svelte (3)
      • 블록체인 (1)
      • IT (66)
      • Rust (0)
  • 블로그 메뉴

    • 홈
    • 태그
    • 미디어로그
    • 위치로그
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    nginx ssl 적용
    spring java
    자바 생성자
    vscode
    자바 객체 지향
    ubuntu
    자바 배열
    브라우저 자동화
    러스트
    Node
    클론코딩
    에디터 팁
    API 설계
    proxy pass
    vue 설치
    java casting
    gitlab 설치
    servlet class
    svelte
    SSL 인증서
    Java Array
    AI 반도체
    자바 exception
    lang rust
    자바 for문
    nginx
    mysql db
    React Compiler
    css tb
    Extension Bisect
    제미나이
    rust linux
    nginx ssl 설정
    리눅스 설치
    VS Code 팁
    티스토리 자동화
    jsp include
    css perspective
    vue cli
    오류
    AI 코딩 에이전트
    css table
    자바 클래스
    ssl 인증서 발급
    docker
    css float
    프런트엔드
    jsp parameter
    Rust lang
    css transition
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.6
밍글링글링
[CSS] ch01-04.Class (클래스)
상단으로

티스토리툴바