## 22 Day Today I Learned
- IP Quiz
IP Quiz
1. ‘값이 할당되지 않은 상태’를 의미하는 데이터는?
1) Boolean
2) String
3) Undefined
4) Null
1) Boolean
2) String
3) Undefined
4) Null
해설
1) Boolean : true, false 두 가지 값밖에 없는 논리 데이터
2) String : 따옴표를 사용하는 문자 데이터
3) Undefined : 값이 할당되지 않은 상태를 의미하는 데이터
4) Null : 값이 의도적으로 비어있음을 의미하는 데이터
2) String : 따옴표를 사용하는 문자 데이터
3) Undefined : 값이 할당되지 않은 상태를 의미하는 데이터
4) Null : 값이 의도적으로 비어있음을 의미하는 데이터
2. css 속성 중 가상클래스 속성이 아닌것은?
1) focus
2) active
3) hover
4) before
해설
before는 가상 요소 선택자이며 요소의 내부 앞내용을 삽입해준다.
3. 주 축의 정렬 방법을 설정하기 위해선 어떤 속성을 써야하나요?
1) flex-flow
2) align-content
3) justify-content
4) align-items
3. 주 축의 정렬 방법을 설정하기 위해선 어떤 속성을 써야하나요?
1) flex-flow
2) align-content
3) justify-content
4) align-items
해설
flex-flow는 단축 속성으로, flex-direction과 flex-wrap을 쓸 수 있습니다.
align-content는 교차 축의 정렬 방법을 (두 줄 이상) 설정합니다.
align-items는 교차 축에서 Item의 정렬 방법을 (한 줄) 설정합니다.
align-content는 교차 축의 정렬 방법을 (두 줄 이상) 설정합니다.
align-items는 교차 축에서 Item의 정렬 방법을 (한 줄) 설정합니다.
4. 다음 중 테이블 행을 만드는 태그는?
1) <tr>
2) <td>
3) <thead>
4) <tfoot>
해설
<tr> : table row
5. HTML의 구조를 설계하는데 있어 태그에 의미를 부여 함으로써 사이트의 구조를 파악하기 쉽도록 만들어진 태그는?
1) 빈태그
2) 시멘틱(sementic) 태그
3) 메타(meta) 태그
4) input 태그
5. HTML의 구조를 설계하는데 있어 태그에 의미를 부여 함으로써 사이트의 구조를 파악하기 쉽도록 만들어진 태그는?
1) 빈태그
2) 시멘틱(sementic) 태그
3) 메타(meta) 태그
4) input 태그
해설
1) 빈태그: 내용을 가지고 있지 않는 태그
3) 메타(meta) 태그: 해당 문서에 대한 정보인 메타데이터를 정의할 때 사용하는 태그
4) input 태그: 사용자가 데이터를 입력하는 태그
6. 태그 중 사이트의 콘텐츠 내용을 검색 사이트나 SNS 등이 효과적으로 확인하거나 게시 시 최적의 데이터를 가져가게 하기 위한 태그는?
3) 메타(meta) 태그: 해당 문서에 대한 정보인 메타데이터를 정의할 때 사용하는 태그
4) input 태그: 사용자가 데이터를 입력하는 태그
6. 태그 중 사이트의 콘텐츠 내용을 검색 사이트나 SNS 등이 효과적으로 확인하거나 게시 시 최적의 데이터를 가져가게 하기 위한 태그는?
1) <meta property="og:XXX" content="YYY" />
2) <script src=”URL”></script>
3) <link rel=”TYPE” href=”URL” >
4) <title>TITLE</title>
2) <script src=”URL”></script>
3) <link rel=”TYPE” href=”URL” >
4) <title>TITLE</title>
해설
1) property 의 값은 제공해야하는 사이트나 SNS 에 따라 달라짐
2) script 를 연결하는 태그
3) 외부 리소스를 연결하는 태그
4) 문서 제목 태그
7. 선택자 우선순위를 높은 점수 순서로 올바른 것은?
1) !important > inline > . > # > tag
2) !important > # > inline > . > tag
3) !important > inline > # > . > tag
4) !important > inline > # > tag > .
2) script 를 연결하는 태그
3) 외부 리소스를 연결하는 태그
4) 문서 제목 태그
7. 선택자 우선순위를 높은 점수 순서로 올바른 것은?
1) !important > inline > . > # > tag
2) !important > # > inline > . > tag
3) !important > inline > # > . > tag
4) !important > inline > # > tag > .
해설
!important : 무한대
inline : 1000점
# : 100점
. : 10점
tag : 1점
8. 요소 밖의 여백을 지정하는 속성은?
1) margin
2) padding
3) border
4) transform
inline : 1000점
# : 100점
. : 10점
tag : 1점
8. 요소 밖의 여백을 지정하는 속성은?
1) margin
2) padding
3) border
4) transform
해설
1) margin 요소 밖에 여백 지정
2) padding 요소 내에 여백 지정
3) border 요소의 선 지정
4) transform 요소의 변환 효과 지정
9. CSS 상속에 대한 항목으로 틀린 것은?
1) 상속이란 부모 요소들이 자동으로 자식 요소에게 자동 적용되는 것을 말한다.
2) 상속 기능들은 대부분 문자와 관련이 있다.
3) 영어로 ‘inherit' 이라고 한다.
4) 강제 상속 속성으로 모든 속성에 상속 기능을 부여할 수 있다.
2) padding 요소 내에 여백 지정
3) border 요소의 선 지정
4) transform 요소의 변환 효과 지정
9. CSS 상속에 대한 항목으로 틀린 것은?
1) 상속이란 부모 요소들이 자동으로 자식 요소에게 자동 적용되는 것을 말한다.
2) 상속 기능들은 대부분 문자와 관련이 있다.
3) 영어로 ‘inherit' 이라고 한다.
4) 강제 상속 속성으로 모든 속성에 상속 기능을 부여할 수 있다.
해설
inherit 을 통한 강제 속성 방법이 있으나 모든 속성이 가능하지는 않다.
10. position의 기본값을 고르세요.
1) absolute
2) fixed
3) static
4) sticky.
10. position의 기본값을 고르세요.
1) absolute
2) fixed
3) static
4) sticky.
해설
position 속성을 별도로 지정해주지 않으면 기본값인 static이 적용됩니다. position 속성이 static 인 요소는 HTML 문서 상에서 원래 있어야하는 위치에 배치됩니다.
11. Flex Container의 속성 중 Items의 수직 정렬 방법을 설정하며, Items가 한 줄일 경우 많이 사용하는 속성은? (flex-direction가 기본 값이라는 전제)
1) justify-content
2) align-items
3) align-content
4) jusitfy-items
11. Flex Container의 속성 중 Items의 수직 정렬 방법을 설정하며, Items가 한 줄일 경우 많이 사용하는 속성은? (flex-direction가 기본 값이라는 전제)
1) justify-content
2) align-items
3) align-content
4) jusitfy-items
해설
flex-direction가 기본 값(row)이라는 전제로 한 줄일 때 수직 정렬은 align-items를 사용한다.
수평 정렬의 경우 justify-content를 사용한다
12. 다음 코드가 브라우저에 렌더링 될 때 인접한 두 child 사이의 margin 값은?
수평 정렬의 경우 justify-content를 사용한다
12. 다음 코드가 브라우저에 렌더링 될 때 인접한 두 child 사이의 margin 값은?
2) 60px
3) 40px
4) 20px
해설
인접 형제 박스 간 마진 상쇄(margin collapse)는 결합되는 margin 중 크기가 가장 큰 하나의 마진으로 상쇄됩니다.
13. 다음 중 빈 태그가 아닌 것은?
1) span
2) img
3) input
4) br
13. 다음 중 빈 태그가 아닌 것은?
1) span
2) img
3) input
4) br
해설
span은 닫힘태그가 있는 태그입니다.
14. 다음 보기 중 HTML 인라인 요소를 고르시오.
1) <img>
2) <h1>
3) <ul>
4) <p>
14. 다음 보기 중 HTML 인라인 요소를 고르시오.
1) <img>
2) <h1>
3) <ul>
4) <p>
해설
img태그는 인라인 요소이다.
15. flex 속성 중 flex-direction와 flex-wrap의 단축 속성을 고르시오.
1) flex-direction
2) align-items
3) flex-wrap
4) flex-flow
15. flex 속성 중 flex-direction와 flex-wrap의 단축 속성을 고르시오.
1) flex-direction
2) align-items
3) flex-wrap
4) flex-flow
해설
flex-flow 속성은 flex-direction과 flex-wrap을 합쳐 지정하는 단축 속성입니다.
