CSS9 CSS-D06 DOCTYPE html> parent element size *{border: 1px dotted red;} p{padding: 20px; margin: 4px;} a{padding: 10px; margin: 10px;} em{padding: 10px;} strong{margin: 20px;} img{padding: 10px;} input{margin: 20px;} hello nice good html DOCTYPE html> sub menu *{margin: 0; padding: 0;} ul{list-style: none;} nav{ height: 50px; background-color: yellow; } #menu>li{ /* nav_item */ display: inline-block; margi.. 2023. 10. 31. Web App: 반응형웹03 DOCTYPE html> company HOME | NOTICE | LOGIN | JOIN COMPANY PRODUCT CUSTOMER SERVICE RECRUIT 2023. 10. 30. Web App: 반응형웹02 DOCTYPE html> rwd *{padding: 0; margin: 0;} #wrap{ width: 90%; border: 4px solid black; margin-right: auto; margin-left: auto; } #wrap div{ display: inline-block; width: 100%; height: 100px; } #wrap div:first-child{background-color: aqua;} #wrap div:nth-child(2){background-color: greenyellow;} #wrap div:nth-child(3){background-color: orange;} #wrap div:nth-child(4){background-color: violet;} #wr.. 2023. 10. 30. Web App: 반응형웹01 DOCTYPE html> 반응형 웹 /* 화면이 가장 작을 때의 CSS */ #aa{ width: 320px; height: 100px; background-color: green; } /* 너비가 560px 이상이면 .. 마치 if()문 같은 문법*/ @media(min-width: 560px){ #aa{ width: 560px; height: 200px; background-color: yellow; } } #aa{ width: 800px; height: 400px; background-color: aqua; } #aa{ width: 680px; height: 300px; background-color: orange; } 2023. 10. 30. 웹사이트 만들어보기 DOCTYPE html> web shop WEB SHOP HOME ABOUT US NEWS MY ACCOUNT CONTENTS 카테고리 컴퓨터 의류 음악 영화 스포츠/레저 가구/인테리어 식품 Shopping Cart 현재 쇼핑카트에 물품이 없습니다. 쇼핑카트 보기 Log In 아이디 패스워드 회원가입 비밀번호분실 Copyright © 2023 Web Shop DOCTYPE html> .product{ width: 200px; float: left; } Lorem ipsum dolor sit amet consectetur adipisicing elit. Modi in minima, nesciunt similique tempora ab quod exercitationem ducimus eveniet quib.. 2023. 10. 30. CSS-D5 DOCTYPE html> my BLOG PAGE body{ background-color: yellow; font-family: 'Times New Roman', Times, serif; margin: 0; } header{ background-color: violet; } header h1{ margin: 0; text-align: center; padding: 10px 0; } nav{ background-color: aqua; display: table-cell; padding: 15px; } section{ background-color: aquamarine; display: table-cell; padding: 15px; } footer{ background-color: bisque; color.. 2023. 10. 30. 이전 1 2 다음