HTML

230316_HTML 기초

ADELA_J 2023. 3. 19. 21:35
  • Chapter 1. 웹 개요와 실습 환경 구축
    1. 인터넷은 전 세계를 연결하는 국제 정보 통신망으로, 컴퓨터나 스마튼폰 같은 디지털 기기로 연결되어 사람들이 정보를 공유할 수 있는 공간입니다.
    2. 하이퍼링크는 인터넷에서 문서 사이를 쉽게 이동할 수 있는 기능입니다.
    3. W3C는 HTML 표준을 비롯한 웹 표준안을 제작하거나 제안하는 일을 하는 국제적인 웹 표준화 단체입니다.
    4. 웹브라우저는 웹에 공개된 정보를 탐색할 수 있게 하는 플고그램입니다.
    5. 플러그인은 사용자 PC에 프로그램을 추가로 설치해 웹 브라우저 기능을 확장하는 방법입니다.
    6. 웹2.0은 서로 다른 사용자가 함께 새로운 콘텐츠를 창조할 수 있는 시대를 의미합니다.
    7. WHATWG는 Web application 1.0 표준을 작성한 단체입니다. 현재는 HTML W/G라는 이름으로 변경했습니다.
    8. Web Application 1.0 표준은 새로운 웹 표준으로 채택된 후 HTML 5 표준이라는 이름으로 변경되었습니다.
    9. 웹은 요청과 응답이라는 간단한 형태로 동작합니다.
    10. URL은 웹에서 어떤 대상을 구분하는 주소를 의미합니다.
    11. URI는 웹에서 어떤 대상을 구분하는 방법들을 총칭합니다.
    12. 요청하는 쪽은 클라이언트 라고 하며, 응답하는 쪽을 서버라고 합니다.
    13. 서버 프로그램은 사용자와 먼 곳에 있기 때문에 백엔드 프로그램이라고 합니다.
    14. 클라이언트 프로그램은 사용자와 가까운 곳에 있기 때문에 프론트엔드 프로그램이라고 합니다.
    15. 마크업은 웹 페이지의 서식이나 구조를 표현하는 정보입니다.
    16. CSS는 HTML 페이지에 스타일을 지정하는 스타일시트를 작성할 때 싸용하는 언어입니다.
    17. ECMA Script는 자바스크립트의 표준 명칭입니다.
    18. 자바스크립트는 HTML 페이지에서 사용자 반응 등을 처리하는 스크립트를 작성하는 언어입니다.
    19. 일렉트론은 HTML5 기반의 데스크톱 애플리케이션 개발 엔진입니다.
    20. 리액트 네이티브는 페이스북에서 만든 모바일 애플리케이션을 개발할 수 있게 하는 엔진입니다.
    21. 크로스플랫폼개발은 한 번 개발해서 여러장치(플랫폼)에 대응하는 것을 의미합니다.
    22. 웹은 1990년대 중반부터 모든 대중이 사용할 수 있게 되었습니다.
    23. 2000년대 초에는 액티브 X와 플래시 덕분에 웹 브라우저로 다양한 것을 할 수 있었습니다.
    24. 자바스크립트를 사용하면 웹 페에지에 프로그래밍 요소를 부여해서 사용자와 반응을 할 수 있습니다.
    25. 그레이디언트, 애니메이션 등 화려한 스타일을 CSS3로 추가할 수 있게 되었습니다.
    26. 단방향 통신뿐만 아니라 양방향 통신도 가능해졌습니다.
    27. 밷터리 잔량 같은 장치 정보도 가져올 수 있게 되었습니다.
    28. 웹브라우저에서 작동하는 클라이언트프로그램(프론트엔드)는 기본적으로 HTML로 요소를 생성ㅇ하고 CSS로 디장니해서 자바스크립트로 프로그래밍 요소를 부여합니다. >> 백엔드 프로그램은 ㅂ자바, C#, 파이썬 등 프로그래밍 언너어가 있음.
  • Chapter 2. 웹 페이지 기본 구조와 작성 방법
    1. 요소는 HTML 페이지를 구성하는 각 부품입니다.
    2. 태그는 요소를 만들 때 사용하는 작성 방법입니다.
    3. 주석은 프로그램 실행에는 여향을 미치지 않고 설명용으로 사용ㅇ하는 코드를 의미합니다.
    4. CSS는 마크업 언어가 표시되는 방법을 기술하는 언어로 HTMl 페이지의 스타일을 지정할때 사용합니다.
    5. JavaScript는 HTML 페이지에서 사용하는 프로그램잉 언어를 의미합니다.
    6. <img title=”바다” alt=”sea” src=”sea.png”>
      1. title, alt, src 속성이름 / 바다, sea, sea.png 속성 값 / 태그 img
  • 연습 종합판
<!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>Practice 0316</title>
        <style>
            h1 {
                color: black;
                background: yellow;
            }
        </style>
        <link rel="stylesheet" href="PracticeStyle.css">
        <script src="PracticeJavaScript.js"></script>
    </head>
    <body>
        <h1>다음 장부터 HTML5를 공부해봅시다</h1>
        <h2>처음에는 외울것이 많다고 생각해서 어렵게 느껴지겠지만</h2>
        <h3>차근차근 공부해봐요.. </h3>
    </body>
    </html>
    ```