본문 바로가기
728x90
반응형

CSS9

CSS 개발자 수업 55일차 - float, position, z-index 1. float 2. position, z-index 1. float [ 정의 ] - 해당 태그의 출력 방식을 따르지 않고, 원래 위치에서 벗어나 라인의 왼쪽/오른쪽 끝으로 이동한다. - left, right, none(default) - float이 적용되면 block 성질이 된다. (최상단 배치) [ 예제 1 ] 테스트입니다.(div) 테스트입니다.(span) [ 예제 2 ] 블럭 태그 상자1 상자2 상자3 인라인 태그 링크1 링크2 링크3 2. position, z-index [ 정의 ] - 태그의 출력되는 위치를 지정하는 속성 - 좌표값을 사용해서 요소의 위치를 지정한다. (x좌표, y좌표) - 좌표를 지정하는 방식이 여러개 존재한다.( 속성에 따라 원점(0,0)이 다르고, 요소 배치 방식도 다르.. 2021. 6. 17.
CSS 개발자 수업 54일차 - text, box, align, overflow, visibility, display, opacity 1. text, font 2. box 3. align 4. overflow 5. visibility, display, opacity 1. text, font [ 속성 ] 1) color - 텍스트 색상, 전경색(Fore Color) - 보통 웹 페이지에서는 #333333 ~ #666666을 많이 쓴다. (기본값인 Black은 잘 안쓴다.) 2) text-align - 텍스트 정렬 - 수평 정렬( left, center, right, justify ) - 내용물 수평 정렬( * 여기서 내용물은 모든 인라인 태그(문자열)을 뜻한다. ) 3) font-size - 텍스트 크기 4) line-height, word-spacing, letter-spacing - line-height : 줄과 줄 사이의 간격 - .. 2021. 6. 15.
CSS 개발자 수업 53일차 - css, selector, background 1. css 2. 선택자, selector 3. 배경, background 1. css [ 정의 ] - CSS, Cascading Style Sheet - 스타일 시트 - HTML 문서의 서식을 구현 및 확장한다. - 디자인 담당 언어 - CSS는 독립 실행이 불가능하다. (반드시 HTML 문서를 기반으로 동작한다.) - 버전: CSS1, CSS2, CSS3(HTML5) [ 장점 ] - 서식 기능이 많다. (현 시점에서 전세계의 모든 웹 페이지의 디자인 구현) - 생산성이 높다. (코드 재사용성이 높다.) - 코드 분리도가 높다. ( HTML CSS 분리 ) [ HTML5에서 CSS를 작성하는 영역 ] [ HTML에서 CSS를 적용하는 방법 3가지 ] 1) 인라인 스타일 시트, Inline Style S.. 2021. 6. 12.
728x90
반응형