inflearn logo
강의

講義

知識共有

1. ウェブ開発基礎 [HTML, CSS]

css 적용 문제

260

mummy2157

投稿した質問数 1

0

<!DOCTYPE html>
<html lang="en">
<head>
    <title>animation information</title>
   
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet"href="main.css">
   
    <style>

        body
        {
            margin:0px;
        }

        header
        {
            position: relative;
            top: 0px;
            width:100%;
            min-width: 1280px;
            height:10vh;
            background-color: hotpink;
        }

        main
        {
            position: relative;
            top: 0px;
            width:100%;
            min-width: 1280px;
            height:90vh;
            background-color: rgb(130, 126, 231);
        }
       
        footer
        {
            position: relative;
            top: 0px;
            width:100%;
            min-width: 1280px;
            height:5vh;
            background-color: hotpink;
        }

        nav    
        {          
            position : relative;
            top: 0px;
            width: 1280px;
            margin:0px auto;
            min-width: 1280px;
            height:100%;
            background-color: rgb(255, 255, 255);
        }    

        button1
        {
            position: relative;
            float: left;
            top: 10px;
            width: 140px;
            cursor: pointer;
        }
        button2
        {
            position: relative;
            top: 10px;
            float: left;
            width: 140px;
            cursor: pointer;
        }
        button3
        {
            position: relative;
            top: 10px;
            float: left;
            width: 140px;
            cursor: pointer;
        }
        button4
        {
            position: relative;
            top: 10px;
            float: left;
            width: 140px;
            cursor: pointer;
        }
        main section1
        {
            position: relative;
            top: 100px;
            width: 600px;
            height: 600px;
            border: 1px solid black;

        }
    </style>
</head>

<body>
   
   <header class = "header">
    <nav class= "nav" >
        <button class="button1">소개</button>
        <button class="button2">추천</button>
        <button class="button3">알림</button>
        <button class="button4">소통</button>
      </div>
    </nav>
   
   </header>
   
   <main class="main">
       <section class="section1">

       </section>
   </main>

   <footer class="footer">

   </footer>
</body>
</html>
 
visual studio code 사용해서 하고있는데, css 적용이 안됩니다 ㅠㅠ

HTML/CSS

回答 1

0

vmproductor0202

안녕하세요. 개발자Park입니다.

클래스이름을 가리킬 경우 .을 사용해주셔야 됩니다.

아래처럼 변경해주시면 되겠습니다.

태그일 경우에는 .을 사용안합니다.

감사합니다.

(예시/수정된 코드일부)

 

      .button4

        {

            position: relative;

            top: 10px;

            float: left;

            width: 140px;

            cursor: pointer;

        }

        main .section1
        {

            position: relative;

            top: 100px;

            width: 600px;

            height: 600px;

            border: 1px solid black;



        }
 

0

mummy2157

감사합니다 ㅠㅠㅠ

Json 플러그인 사용시 variable collection 없음

0

12

1

배리어블 목록 없음

0

22

3

Token 등록 방법 문의

0

19

1

6-6 실습 문의

0

23

2

섹션5 노션링크 는 따로 없나요?

0

29

2

Part 4에서 강의 연관 노션 정보들이 워드파일에 없습니다.

0

32

2

첨부자료 Part 4 코드 확인 부탁드리겠습니다.

0

27

2

선생님 각 강좌마다 예시로 보여주시는 웹페이지들은 어디서

0

24

1

퍼플렉시티 최소 결제단위 50달러로 바뀐 것 같습니다.

0

54

2

css 안먹어요

0

164

1

폼테그 안에 메소드

0

203

1

자동완성 설정하는 방법?

0

370

1

html 구조 설계 진행 방식

0

305

1

form태그 method 질문

0

223

1

html 태그 질문

0

258

1

행과 열

0

329

2

자꾸 이런 창이 뜹니다

0

230

1

Value 값에 대해서

0

207

1

어느 순간부터 키가 제대로 안먹힙니다...

0

358

1

다중커서

0

313

2

링크 거는거 설명해주실때 네이버로 하는거 보여주시는데 a태그 건다고 할때 a뒤에 어떤기호인가요? 그냥 점으로 하면 안되는 것 같아서 여쭤봅니다

0

186

1

main이 적용이 안됩니다ㅜ

0

281

2

LIVE SERVER 문제

0

260

1

소스를 좀 볼수있을까요?

1

283

3