CSS 기초

CSS CSS : Cascading Style Sheets 웹 문서의 전반적인 스타일을 미리 저장해 둔 스타일시트 CSS 선택자 선택자 예시 설명 # #header{} id . .header{} class (element) body{} 엘리먼트 전체 * *{} 전체 > ul > li {} ul 안에 있는 li , ul, li {} ul 과 li CSS 속성 속성 속성값 설명 display none, block, inline, inline-block ... 블럭형태, 인라인형태를 설정 margin a, b, c, d; 블록 바깥 여백(간격 띄울 때) padding a, b, c, d ; 블록 내부 여백(간격 띄울 때) float right, left 블럭이 기본 틀에서 빠져서 텍스트나 인라인 요소가 그 주..

• format_list_bulleted HTML & CSS
• · 2022. 10. 12.
• textsms

221012 CSS

css, html, 시멘틱 마크업, 선택자, 속성, 속성값 오늘 내가 배운 것 html의 엘리멘트 중에서 section , article, footer, header, aside >> 다 div 의 역할 vscode html 파일만들고 ! 를 작성하면 기본적인 html 틀을 만들어 준다. 과 엘리먼트는 닫는 태그를 사용하지 않아도 된다. CSS에 대하여 Cascading style sheets 파일을 파일이름.css 로 해서 만들어 줄 수 있다. CSS역할 기본적으로 html을(구분해준 데이터를) 꾸며주는 역할을 한다. (기본적인 속성을 변경할 수 있다.) 사용자가 사용하는 환경에 따라 보이는 기본적인 서체, 박스 같은 게 다르게 보일 수 있는 것을 개발자가 원하는 스타일대로 통일시켜서 꾸며 줄 수 있다..

• format_list_bulleted TIL(Today I Learned)
• · 2022. 10. 12.
• textsms

HTML

브라우저란? 평소엔 검색을 위한 용도로만 알고 있었지만, 이제는 HTML을 해석해주는 도구로 확장시키자. 브라우저는 주소창과 , HTML을 해석해서 화면에 보여주는 부분으로 나뉠 수 있다. HTML은? Hyper Text Mark-up Language 의 약자로 인터넷의 하이퍼텍스트를 표현하기 위한 언어 로 작성한다. 와 시작과 끝을 의미하는 것으로 HTML에선 필수! VScode HTML을 작성하는 데는 메모장으로도 충분히 할 수 있지만, 작업의 편의성( 를 작성하면 까지 작성)을 위해 VScode (Visual Studio Code)를 이용한다. VScode - 1. 작업 폴더 생성 및 설정 2. 텍스트 파일 만들기 (.html) 3. 한국어 설정하기 4. Live server 설정하기 더보기..

• format_list_bulleted HTML & CSS
• · 2022. 10. 11.
• textsms

221011 HTML

브라우저란? 평소엔 검색을 위한 용도로만 알고 있었지만, 이제는 HTML을 해석해주는 도구로 확장시키자. 브라우저는 주소창과 , HTML을 해석해서 화면에 보여주는 부분으로 나뉠 수 있다. HTML은? Hyper Text Mark-up Language 의 약자로 인터넷의 하이퍼텍스트를 표현하기 위한 언어 로 작성한다. 와 시작과 끝을 의미하는 것으로 HTML에선 필수! VScode HTML을 작성하는 데는 메모장으로도 충분히 할 수 있지만, 작업의 편의성( 를 작성하면 까지 작성)을 위해 VScode (Visual Studio Code)를 이용한다. VScode - 1. 작업 폴더 생성 및 설정 2. 텍스트 파일 만들기 (.html) 3. 한국어 설정하기 4. Live server 설정하기 더보기..

• format_list_bulleted TIL(Today I Learned)
• · 2022. 10. 11.
• textsms

[유튜브 '드림코딩'] 자바스크립트(JavaScript ES6) 9강 (1)

배열 함수, Array APIs, join, split, reverse, slice 오늘 내가 배운 것 .join() //join(separator?) 배열에 있는 모든 데이터를 더해서 string으로 리턴해준다. 기본은 쉼표(,)로 구분된다. (선택) separator : string Ex ) .join(’|’); .split() //split(separator, limit?) string을 배열로 바꿔 준다. limit 는 string이 여러 개로 있을 때 지정한 값까지만 배열로 바꿔 준다. (필수) separator : string (선택) limit : number .reverse() //reverse() 배열의 순서를 거꾸로 한다. 리턴 값만 순서가 바뀌는 게 아니라 배열 자체도 순서가 바뀐다...

• format_list_bulleted TIL(Today I Learned)
• · 2022. 10. 10.
• textsms

[유튜브 '드림코딩'] 자바스크립트(JavaScript ES6) 8강 (2)

Addition, Deletion, Combine, Searching 오늘 내가 배운 것 배열에 데이터가 있을 때 뒤에서 부터 넣고 빼는 것은 빈 공간에 데이터를 넣고 빼는 것이기 때문에 기존의 데이터를 움직이지 않아도 되어서 빠른 처리가 가능하지만 (push, pop) 기존 데이터 전체를 앞으로 뒤로 옮기면서 기존 데이터 앞에 새로운 데이터를 추가, 제거할경우 처리 속도가 느리다. (shift, unshift) splice (start, deleteCount?) 지우기 시작하는 index는 반드시 적어두고 지우고 싶은 개수는 필요시 적는다. 지우고 싶은 개수를 안 적으면 시작점 이후로 모든 데이터를 지우게 된다. splice ( start, deleteCount , …item) …item 에 데이터를 ..

• format_list_bulleted TIL(Today I Learned)
• · 2022. 10. 8.
• textsms