공부기록/실습33 과제 교육원 사이트 만들기(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. 영역별로 레이아웃 만들기(이미지 포함) 똑같이 만들어 보기! 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. 과제 영역별 레이아웃 똑같이 만들기 똑같이 만들어 보기! 머리말 입니다. 내비게이션 영역, 이전, 이후, 홈 광고입니다. 계란 사세요, 계란~~ 첫 번째 기사 두 번째 기사 세 번째 기사 꼬리말 입니다. 회사 연락처 등 똑같이 그림만 보고 만드는 것은 생각했던 것보다 어려웠고, 가장 쉽다고 생각했던 중간 section과 article 부분을 어떻게 처리해야 하는지 의문이 들었다. 어떤 부분에 무엇을 써야 하는지에 대해서 확실하게 개념이 잡아야 할 것 같다. 2023. 2. 28. 배경 이미지만 투명하게 처리하기 배경을 반투명하게 하면 내부 요소로 같이 반투명하게 된다. 하위 영역도 같이 적용이 되기 때문에 배경을 뒤로 처리해서 사용한다. content는 빈 내용으로 넣는다. 꼭 넣어주어야 한다! !important 꼭 적용하기 제목입니다. first second 2023. 2. 27. 드롭 다운 메뉴 만들기 hover를 사용한 드롭다운 메뉴 만들기 마우스가 올라가면 메뉴가 열립니다. Home News Dropdown Link 1 Link 2 Link 3 이런저런 내용 이런저런 내용 이런저런 내용 이런저런 내용 이런저런 내용 이런저런 내용 이런저런 내용 이런저런 내용 이런저런 내용 이런저런 내용 이런저런 내용 이런저런 내용 이런저런 내용 이런저런 내용 이런저런 내용 2023. 2. 27. 테이블 스타일링 성 이름 연락처 김 길동 010-1111-2222 나 길동 010-2222-3333 박 길동 010-3333-4444 장 길동 010-4444-5555 최 길동 010-5555-6666 2023. 2. 27. 이전 1 2 3 4 5 6 다음
