코딩/HTML&CSS (10) 썸네일형 리스트형 CSS, 과제3 메인페이지 작성 http://zmwaexp.dothome.co.kr/ : : bomi's home : : 로그인 회원가입 즐겨찾기 뉴스기사 이력서 . . . . CSS, 과제2 로그인 로그인 상태 유지 회원가입 아이디: *4~12글자까지만 입력하세요 비밀번호: *4~12글자까지만 입력하세요 비밀번호 확인: *4~12글자까지만 입력하세요 이름: 생년월일: 이메일: 주소: 주소검색 전화번호: 02 031 032 033 041 .. CSS, 3일차 z-index - HTML 요소의 위치를 설정하게 되면 위치 및 방식에 따라 요소가 겹칠 수 있음 - 겹쳐지는 요소들이 쌓이는 순서를 결정할 때 z-index를 사용 - 순서는 숫자의 숫자의 크기가 클수록 위에 위치하고 작을수록 아래 위치하게 됨 z-index 1번째 div 2번째 div 3번째 div float - HTML 요소가 주변(수평으로 나열된)의 다른 요소들과 자연스럽게 어울리도록 만듦 - float를 적용받은 요소의 다음에 나오는 모든 요소들이 끌어올려짐 - float를 적용받은 요소의 다음에 나오는 요소방향을 결정(left, right) - 컨텐츠 크기 만큼만 영역을 설정(블록) - float를 적용받은 요소는 다른 요소(배경)보다 위.. CSS, 2일차 CSS 배경 background-color: HTML 요소의 배경색을 설정 배경2 배경 적용하기 Lorem ipsum dolor, sit amet consectetur adipisicing elit. Aperiam dolorem quae ducimus pariatur ipsum nisi consequatur molestiae deserunt id cumque consequuntur, atque eligendi ut ullam non sed ratione asperiores sequi? background-image - HTML 요소의 배경으로 나타날 배경 이미지를 설정 - 배경 이미지는 기본 설정으로 반복되어 나타남 background-image: url.. CSS, 과제1 과제'뉴스기사' 페이지를 CSS 선택자, CSS 텍스트를 사용하여 자유롭게 스타일을 적용 푸바오 돌아갔지만…판다는 ‘기후변화’로 멸종 위험 [팩트체크K]'국민 판다'로 사랑받던 자이언트 판다 푸바오가 어제(3일) 중국으로 반환된 가운데, 왜 푸바오가 중국으로 돌아가야 했는지 아쉬움의 목소리가 큽니다.중국의 도시화와 밀렵 등으로 판다가 멸종위기를 맞았고, 이후 중국 정부에서 개체 수 보전을 위해 판다의 번식 등을 엄격히 관리하기 때문이라고 전해드린 적 있는데요.[연관 기사] 판다가 멸종위험종이 된 건 ‘인간’ 때문이다?https://news.kbs.co.kr/news/pc/view/view.do?ncd=7927189중국으로 돌아간 판다들, 과연 안전한 걸까요?최근 전문가들 사이에선 "기후변화로.. CSS, 1일차 CSS(Cascading Style Sheets) 웹 페이지의 특정 요소 또는 요소 그룹에 적용할 스타일 그룹을 지정하는 규칙을 정의하는 언어 CSS 문법 HTML 문서 사이에 요소를 사용하여 적용하는 방법 3. 외부 스타일 웹 사이트 전체의 스타일을 하나의 파일에서 변경할 수 있도록 적용하는 방법 ✔ rel 현재 문서와 링크된 문서 사이의 연관관계를 명시 인라인 스타일 HTML 요소 내부에 style 속성을 사용하여 적용하는 방법 CSS를 적용하는 방법 인라인 스타일 내부 스타일 외부 스타일 CSS를 적용하는 방법 인라인 스타일 내부 스타일 외부 스타일 선.. HTML, 과제2 문제 - 닷홈에 아래 두 페이지를 연결하기 로그인 페이지 login.html 회원가입 페이지 regist.html 로그인 로그인 상태 유지 회원가입 아이디: *4~12글자까지만 입력하세요 비밀번호: *4~12글자까지만 입력하세요 비밀번호 확인: *4~12글자까지만 입력하세요 이름: 생년월일: 이메일: 주소: 주소검색 전화번호: 02 031 .. HTML, 3일차 HTML의 디스플레이 1. 인라인 - content의 크기 만큼만 자리를 차지하는 요소 - 텍스트, img, span 등 - 텍스트의 특징을 가지고 있음 2. 블록 - 라인을 모두 차지하는 요소 - p, h, ul, li, div 등 - 면의 특징을 가지고 있음 span 태그 - 인라인 특징을 가지고 있음 - 글자 단위로 영역을 설정 div 태그 - 블록 특징을 가지고 있음 - 면 단위로 영역을 설정 시멘틱(Semantic) 태그 Semantic: 의미가 있는, 의미론적인 - div > div > div > ... 끝없는 div를 탐색하는 것보다 효율적 - 개발자에게 명확한 의미를 전달 - 스크린 리더를 사용하여 페이지를 탐색할 때 도움 - 검색엔진 봇에게 정보를 제공 디스플레이 1. sp.. 이전 1 2 다음
