Computer Science/html + css + js

html+css 2일차: 웹의 기본 내용

무니화니 2022. 1. 8. 18:23

저번 시간에는 html에 쓰이는 기본적인 태그들에 대해서 공부했었다.

오늘은 html의 기초적인 내용과, 웹에 대한 기본적인 배경 내용에 대해 다루어 보겠다.

 

첫째로, 내가 연습한 코드를 공개하겠다.

<!DOCTYPE html>
<html>
    <meta charset="utf-8">
    <head>
        <title>
            hello 2생활관
        </title>
    </head>
    <body>
        <h1><font color="blue">2생활관 baby들</font></h1>
        <a href="hwan.html">최환짱</a>
        <ol>
            <style>
                li{
                    font-size:60px;
                    text-align:center;
                    text-decoration:none;
                }
            </style>
          
            <li><a href="hwan.html",target="_blank">최환</a></li>
            <li>박준서</li>
            <li>이원재</li>
            <li>박지승</li>
            <li><a href="http://www.naver.com">네이버</a></li>
            
        </ol>
        <h2>롤체하고싶다</h2>
    </body>
</html>

이 코드를 보고 오늘 공부한 내용들에 대해서 정리해보겠다.

첫째로, title 사이에 페이지의 전체적인 내용을 나타내는 제목을 적었다.

그리고 h1 사이에 소제목을 적고,

밑에 '최환짱'을 클릭하면 다른 페이지로 이끌어주는 링크를 만들었다.

ordered list를 만들었다.

밑에 있는 list의 디자인을 <style>문을 이용해서 만들었다.

글자의 크기랑, 정렬과, 링크에 있는 밑줄을 없애기 위해 text-decoration을 none으로 설정했다.

그리고 밑에 생활관에 있는 아이들을 ordered list에 넣었다.

 

이런 식으로 코드를 만들어 봤다.

생각보다 잘 작동해서 신기했다.

 


웹과 인터넷은 서로 다르다.

웹은 운영체제 위에 있는 프로그램이고, 인터넷은 운영체제이다.

 

인터넷이 작동하기 위해서는, 2개의 컴퓨터가 최소로 필요하다.

기본적으로 서버와, 클라이언트가 필요하다.

클라이언트가 서버에게 정보를 요청하면,

서버가 클라이언트에게 응답을 실행한다.

 

(사진으로 이를 설명하고 싶은데, 군대 내에서는 문제가 있다.)

 


그리고 만든 파일을 작동시킬때, github를 이용하면 편리하다.

 

github는 소스코드를 보관하는 사이트라고 생각하면 되겠다.

 

더 설명을 잘 하고 싶은데, 그림을 그릴 수 없어서 참 아쉽다.