2024/5/30

 

vs code 설치 이유

- 메모장에 해도 되지만 편리하기 때문에


vs code 설치 이후

frontend 폴더 만들기

tags.html 파일 생성

html : 5를 치면

 <!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
   
</body>
</html>

위와 같은 것이 생성 됨

Format Document(문서 서식) VS Code에서 Shift + Alt + F (맥은 Shift + Option + F) 로 자동정렬 기능을 사용해보면 좋음.


css_html 꾸미기


<body>내부

<div class="mytitle">
            <h1>로그인 페이지</h1>
            <h5>아이디, 비밀번호를 입력해주세요</h5>
        </div>

class로 style에 정의되어 있는 것을 사용.

<style>
            .mytitle{
                width: 300px;
                height: 200px;
                background-color: green;

                color: white;
                text-align: center;
            }       
</style>

단 <head> 안에 넣어있을 것.

<head>
        <meta charset="UTF-8">
        <title>로그인페이지</title>
        <style>
            .mytitle{
                width: 300px;
                height: 200px;
                background-color: green;

                color: white;
                text-align: center;
            }
            .mybtn{
                padding: 30px;
            }
        </style>
    </head>




댓글

이 블로그의 인기 게시물