본문 바로가기

분류 전체보기204

12. Element가 배치되는 방법(CSS layout)-1 엘리먼트가 배치되는 방식 엘리먼트를 화면에 배치하는 것을 layout 작업이라고도 하고, Rendering 과정이라고도 합니다. 편의상 우리는 배치라고 할 겁니다. 기본 엘리먼트는 위에서 아래로 배치되는 것이 기본입니다. 하지만 웹사이트의 배치는 다양하게 표현 가능해야 하므로, 이를 다양한 방식으로 배치할 수 있도록 다양한 속성을 활용합니다. 중요하게 이해해야 할 속성은 다음과 같습니다. display(block, inline, inline-block) position(static, absolute, relative, fixed) float(left, right) 이 속성을 중심으로 엘리먼트의 배치를 이해할 겁니다. 엘리먼트가 배치되는 방식 - (display:block) display속성이 block이.. 2021. 6. 13.
11. CSS 기본 Style 변경하기 1em은 기본 font의 값이 16px일떄의 값이다. 그렇다면 부모노드가 2em이면 자식노드의 font값도 32px이 된다.. my text is upper! 2021. 6. 13.
10. css selector n번째 자식요소를 선택(nth-child) span tag span tag 2 단락 선택 첫번째 단락입니다 두번째 단락입니다 세번째 단락입니다 네번째 단락입니다 여기서 #jisu>p:nth-child(2){color:red} 라고 한다. 그렇다면 무엇이 빨간색으로 변할까? 인덱스는 1부터 시작한다. 정답은 첫번째 단락입니다가 빨간색으로 변한다. 즉 nth-child는 모든 요소 포함해서 자식을 센다. 특정 type의 자식만 세고 싶으면, nth-type-of를 사용하면 된다.. 2021. 6. 13.
9. 상속과 우선순위 결정 -2 cascading 이란, 일단 css(Cascading style sheets)의 의미를 알면 쉽다. 즉 css의 의미는 우선순위가 있는 스타일 시트라는 뜻이다. 캐스케이딩를 결정하는 요소 1. 중요도 2.명시도 3.코드의 순서 1. 중요도는 저작자 !important > 저작자 css > 사용자 css > 브라우저 css 등이 있다. 2. 명시도는 style >id>class>태그 등이 있다. 2021. 6. 13.
반응형

티스토리툴바