본문 바로가기

Python_WEB/HTML

(151)
[HTML]Study 요약 정리 2 1. 북마크 이동하고 싶은 곳에 입력 링크를 걸고자 하는 앵커에 내용 입력 에서 북마크 지정 없이 #만 입력하면 무조건 가장 위로(top) 올라가게 됨 * 북마크는 화면에 보이지 않으나 프로그램에서 인식됨 2. “Ul, li” 목록 태그 ul (unordered list) : 순서 없는 목록 리스트 li (list item) blue white black 3. “Ol” 목록 태그 ol (unordered list) : 순서 있는 목록 리스트 초등학교 중학교 고등학교 대학교 * Ol type 종류 1234… abcde… I II III IV … Ol start 지점부터 시작됨 중간에 Value 값으로 변경가능 4. 정의 목록 태그 dl (dictionary list) : 순서가 없는 정의 목록 태그이며 l..
[HTML]Study 요약 정리 1 1. HTML 기본 틀 본문이 될 내용 * [Tab] 키를 사용하여 태그 정렬 * … 태그는 / 로 닫아줌 * 태그는 주석문 2. 배경색과 글꼴색 바디문 글꼴색 지정 해당 문장의 글꼴색 지정 * Css에서 배경색 : { background-color:blue } * Css에서 글꼴색: { Color:blue } 3. 배경 이미지 넣기 * ../은 폴더 바깥에 있을 경우 지정 * Css에서는 Body { background-image:url(폴더명/이미지명.확장자); } 4. “P, br, pre” 태그 pre는 공백이 그대로 나타납니다 br은 Enter 기능을 수행합니다 p는 강제로 행을 내려줍니다 * 태그는 / 생략이 가능함 * 은 사용한만큼 적용됨 * 는 중복적용 안됨 5. Hn 태그와 폰트 사이즈 ..
[부스트코스]반응형 웹 - MOBILE 제작 퀴즈 Q> 반응형 웹을 만들기 위해 조건문을 작성하려고 합니다. 가로 해상도가 각각 375, 360, 320인 핸드폰이 있고 그들의 css는 하나로 구성되어 있을 때맞는 반응형 조건문을 고르시오. @media screen and (max-width: 375px) @media screen and (max-width: 360px) @media screen and (max-width: 320px) @media screen and (min-width: 375px) and (max-width: 320px) @media screen and (max-width: 375px) and (max-width: 360px) and (max-width: 320px) A> @media screen and (max-width: 375p..
[부스트코스]반응형 웹 - TABLET 제작 퀴즈 Q> 스크린 환경이면서 최대 가로 길이가 1280px을 넘지 않고 비율이 가로가 더 긴 경우에 해당 코드를 적용하시오. 위와 같은 환경의 미디어 쿼리 조건문을 제대로 작성한 내용은 무엇인가? @media screen and (max-width: 1280px), screen and (max-height: 768px) and (orientation: landscape) @media screen and (max-width: 1280px) and (orientation: landscape) @media screen and (max-width: 1280px), screen and (max-height: 1280px) and (orientation: landscape) @media screen and (max-wi..
[부스트코스]반응형 웹 - PC용(기본) 제작 퀴즈 Q> 반응형 웹에서 해상도에 따른 분기법으로 미디어 쿼리를 사용합니다. 그렇다면 이번 강의에서 기본 내용을 담게 되는 PC버전은 어떤 방식으로 분기가 된 내용에 담겨야 할까요? @media screen and (max-width: 768px) @media screen and (max-height: 768px) and (orientation: landscape) @media print and (orientation: portrait) 분기처리 하지 않는다. @media screen and (max-height: 768px) A> 분기처리 하지 않는다. www.boostcourse.org/web344/ 웹 UI 개발 부스트코스 무료 강의 www.boostcourse.org
[부스트코스]반응형 웹 소개 퀴즈 Q> "이것"은 브라우저에서 제공해주는 기능 중에 하나로 개발을 할 때 필요한 여러 가지 정보들을 보여줍니다. 이번 강의에서 반응형 웹이 잘 되는지 확인하기 위해 사용하기도 한 이것의 보편적인 이름은 무엇인가요? 개발자도구 디자이너도구 마크업도구 HTML탐색기 CSS탐색기 A> 개발자도구 www.boostcourse.org/web344 웹 UI 개발 부스트코스 무료 강의 www.boostcourse.org
[부스트코스]폼 커스텀 - SELECT 메뉴 퀴즈 Q> select 태그의 기본 버튼의 모양을 없애기 위해서 사용하는 속성값을 제대로 사용한 코드는 무엇인가? appearance: none; -moz-appearance: none; -webkit-appearance: none; appearance: button; -moz-appearance: button; -webkit-appearance: button; opacity: none; -moz-opacity: none; -webkit-opacity: none; transform: none; -moz-transform: none; -webkit-transform: none; transform: button; -moz-transform: button; -webkit-transform: button; A> ap..
[부스트코스]폼 커스텀 - 파일찾기 퀴즈 Q> 타입의 태그는 버튼과 선택된 파일명이 나오는 형태를 커스텀 하기가 쉽지 않기 때문에 커스텀 된 내용 위에 투명하게 만들어서 선택이 되도록 해야 한다. 해당 태그를 투명하게 하기 위한 속성과 속성값은 무엇인가? opacity: 0; opacity: 1; visibility: hidden; visibility: visible; display: none; A> opacity: 0; www.boostcourse.org/web344 웹 UI 개발 부스트코스 무료 강의 www.boostcourse.org