HTML63 사이트 그대로 따라 만들기(롯데월드 메인 페이지-css) @charset "UTF-8"; * { margin: 0; padding: 0; } li { list-style: none; } body { font-family: 'NotoSans-Light', '맑은 고딕', 'Malgun Gothic', sans-serif; font-size: 16px; color: #555; } header { height: 147px; } section { height: 3000px; margin: 0 auto; } footer { height: 250px; } /* header */ div#h_top { height: 47px; background-color: rgb(248, 248, 248); } div#h_bottom { width: 1400px; height: 100px.. 2023. 3. 4. 사이트 그대로 따라 만들기(롯데월드 메인 페이지) html 파일 SEOUL SKY 롯데월드 아쿠아리움 롯데워터파크 롯데월드 어드벤처 부산 민속박물관 아이스링크 Login 회원가입 KOR 즐길거리 요금/우대혜택 참여프로그램 이용가이드 소통서비스 상품몰 기업체 단체 예매 검색 첫번째 두번째 세번째 네번째 다섯번째 여섯번째 일곱번째 1 2 3 4 5 6 7 오늘의 파크 운영시간 10:00 ~ 21:00 나에게 꼭 맞는 혜택 알아볼까요? 현재 진행 중인 할인혜택을 알아보세요. 롯데월드카드 제휴카드 온라인 프로모션 카카오페이지로 가보자 교복우대 더 많은 혜택보기 재미있고 즐거운 다양한 어트랙션! 아이와 함께 야외에서 신나게 실내에서 쾌적하게 언더씨킹덤 유레카 점핑피쉬 매직붕붕카 월드모노레일 키즈토리아 더 많은 어트랙션 보기 윤휴정보 보러가기 html 문서 보기 .. 2023. 3. 2. 교육원 사이트 만들기 정답 @charset "UTF-8"; * { margin: 0; padding: 0; } li { list-style: none; } header { height: 105px; } section { /* width: 960px; */ height: 1220px; margin: 0 auto; } footer { height: 205px; } div#h_top { height: 35px; background-color: gray; /* margin: 0 auto; */ } div#h_bottom { width: 960px; height: 70px; margin: 0 auto; } div#h_top>div#h_top_wrap { /* height: 35px; line-height: 35px; */ width: 96.. 2023. 2. 28. 과제 교육원 사이트 만들기(CSS 연습) css 파일 @charset "UTF-8"; * { margin: 0; padding: 0; } li { list-style: none; } header { height: 105px; } section { width: 960px; height: 1220px; margin: 0 auto; } footer { height: 205px; } div#h_top { height: 35px; background-color: gray; margin: 0 auto; } div#h_bottom { width: 960px; height: 70px; margin: 0 auto; } div#h_top>div#h_top_wrap { height: 35px; line-height: 35px; } div#h_top>div#h_to.. 2023. 2. 28. 2월 28일 영역별 레이아웃 만들기 정답 + 사이트 레이아웃 만들기 GIMP GIMP - The GNU Image Manipulation Program: The Free and Open Source Image Editor www.gimp.org 무료 그래픽 툴 선택자 지정 시 구체적으로 명확하게 명시해 주는 것이 좋다. 색이 지정되어 있지 않으면 그림판에서 색을 뽑아서 확인한다. 탑-다운 접근법 : 큰 문제를 쪼개서 시작하는 것이 필요하다 float 영역이 나누어져 있으면 서로 간섭을 하지 않는다. 개발자 도구를 통해서 똑같이 적용해 보는 연습 해 보기 오류를 찾을 때도 사용 CSS 파일 @charset "UTF-8"; /* 전체 요소에 대한 처리 */ * { padding: 0; margin: 0; } /* 리스트 요소 처리*/ li { list-style: none;.. 2023. 2. 28. 영역별로 레이아웃 만들기(이미지 포함) 똑같이 만들어 보기! 1. header header { background-color: yellow; border: 2px solid blue; margin-bottom: 10px; position: relative; } 2. nav nav { background-color: lime; border: 1px solid red; position: absolute; right: 5px; bottom: 5px; width: 300px; } 3. aside aside { float: right; width: 20%; background-color: orange; padding: 10px; } 4. section section { padding: 10px; border: 1px solid black; backgr.. 2023. 2. 28. 이전 1 ··· 3 4 5 6 7 8 9 ··· 11 다음
