강의/웹 프로그래밍(풀스택)40 부스트코스 웹 프로그래밍(풀스택) - 1. 웹 프로그래밍 기초 - 3-5-2 강의 정리 [1] 강의 웹 프로그래밍(풀스택) 3. CSS - FE 5) Element가 배치되는 방법(CSS layout)-2 [2] 개념 정리 엘리먼트가 배치되는 방식 엘리먼트를 화면에 배치하는 것을 layout 작업이라고도 하고, Rendering 과정이라고도 합니다. 편의상 우리는 배치라고 할 겁니다. 기본 엘리먼트는 위에서 아래로 배치되는 것이 기본입니다. 하지만 웹사이트의 배치는 다양하게 표현 가능해야 하므로, 이를 다양한 방식으로 배치할 수 있도록 다양한 속성을 활용합니다. 중요하게 이해해야 할 속성은 다음과 같습니다. display(block, inline, inline-block) position(static, absolute, relative, fixed) float(left, right) 이 속.. 2022. 4. 2. 부스트코스 웹 프로그래밍(풀스택) - - 1. 웹 프로그래밍 기초 - 3-5-1 강의 정리 [1] 강의 웹 프로그래밍(풀스택) 3. CSS - FE 5) Element가 배치되는 방법(CSS layout)-1 [2] 개념 정리 엘리먼트가 배치되는 방식 엘리먼트를 화면에 배치하는 것을 layout 작업이라고도 하고, Rendering 과정이라고도 합니다. 편의상 우리는 배치라고 할 겁니다. 기본 엘리먼트는 위에서 아래로 배치되는 것이 기본입니다. 하지만 웹사이트의 배치는 다양하게 표현 가능해야 하므로, 이를 다양한 방식으로 배치할 수 있도록 다양한 속성을 활용합니다. 중요하게 이해해야 할 속성은 다음과 같습니다. display(block, inline, inline-block) position(static, absolute, relative, fixed) float(left, right) 엘리먼.. 2022. 4. 1. 부스트코스 웹 프로그래밍(풀스택) - 1. 웹 프로그래밍 기초 - 3-4 강의 정리 [1] 강의 웹 프로그래밍(풀스택) 3. CSS - FE 4) CSS 기본 Style 변경하기 [2] 개념 정리 CSS style 적용은 글자색, 배경색 등이 가장 자주 사용되는 것들입니다. 이런 속성은 위치 값과 크기를 지정하는 것과 달리, 색상 위주로 값을 부여합니다. 색상 관련 값은 다양한 색을 일관된 방법으로 표현하기 위해 주로 16진수 표기법을 사용합니다. font 색상 변경 color : red; color : rgba(255, 0, 0, 0.5); color : #ff0000; //16진수 표기법으로 가장 많이 사용되는 방법이죠. font 사이즈 변경 font-size : 16px; font-size : 1em; 배경색 background-color : #ff0; background-imag.. 2022. 3. 28. 부스트코스 웹 프로그래밍(풀스택) - 1. 웹 프로그래밍 기초 - 3-3 강의 정리 [1] 강의 웹 프로그래밍(풀스택) 3. CSS - FE 3) CSS Selector [2] 개념 정리 element에 style 지정을 위한 3가지 기본 선택자 tag로 지정하기 id로 지정하기 HELLO World! class로 지정하기 HELLO World! CSS Selector의 다양한 활용 id, class 요소 선택자와 함께 활용 #myid { color : red } div.myclassname { color : red } 그룹 선택 (여러 개 셀렉터에 같은 style을 적용해야 한다면) h1, span, div { color : red } h1, span, div#id { color : red } h1.span, div.classname { color : red } 요소 선택 (공백) :.. 2022. 3. 28. 이전 1 ··· 3 4 5 6 7 8 9 10 다음