🌱 → 🌳

Container container 속성값들 display flex-direction flex-wrap flex-flow justify-content flex-start: 요소들을 컨테이너의 왼쪽으로 정렬 flex-end: 요소들을 컨테이너의 오른쪽으로 정렬 center: 요소들을 컨테이너의 가운데로 정렬 space-between: 요소들 사이에 동일한 간격을 둠 space-around: 요소들 주위에 동일한 간격을 둠 align-items align-content Item item 속성 값들 order: item 순서 flex-grow : 고유한 사이즈 유지(0), 박스에 맞도록 변경(1) flex-shrink: container size 작아질 때 어떻게 작아질지 설정 flex-basis: item이..

CSS 레이아웃 정리 display, position 완성 Display block인 div를 inline-block으로 inline인 span을 block으로 display해줄 수 있다. Position position: static; //CSS default 값 position: relative; //원래 위치에서 옮겨감 position: absolute; //내 item이 담겨있는 박스안에서 위치 변경 position: fixed; //박스를 완전히 벗어나 윈도우(페이지)안에서 위치변경 position: sticky; //원래 자리에 있되, 스크롤을 올리거나 내려도 그 자리 유지 absolute를 쓰면 가까운 위치에 있는상자(부모)에서 배치되고 맞기는 하지만 그경우는 부모속성에 relateve를 주..

HTML 1. 뭐든지 나누어 보자 : 박스화해서 (header, nav, footer, aside,,) https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure 2. 어떤 것을 배우든 큰 그림을 먼저 보자 tag는 크게 2가지로 나눌 수 있음 : Box, item [Box] Header section Footer article Nav div Aside span Main form [Item] 사용자에게 보여지는 tag a, button, input, label, img, video, audio, map, canvas, table Block vs inline Content + ta..

✅ html 이 html5 버전임을 알려주는 코드 ✅ ~~~ 모든 html 문서는 html 태그로 감싸져 있다. (기본 구조) ✅ html 문서의 메타데이터를 모아놓은 부분 쉽게 말해, 웹사이트에 표시되진 않지만 웹사이트의 정보/데이터를 담아놓은 부분 ✅ ~~~ html 구조의 컨텐츠 영역(디자인/기능 태그) ⭐ 정리하기 ⭐ ✔ html의 태그는 모두 중첩할 수 있다. ✔ html의 기본 구조 - - html 태그 안에 head 태그, body 태그

📌 선택자 웹 페이지를 표현하는 데이터 모두가 태그로 이루어져 있기떄문에, 그 중 서로 동일한 태그가 존재할 수 있음 이렇게 동일한 태그를 분간해 주기 위해, HTML에서는 선택자라는걸 사용해 각 태그를 구별할 수 있는 일종에 주소를 부여함 📌 선택자의 필요성 아래와 같은 HTML 문서가 있다고 가정해 보면, 파이썬 크롤링 C언어 게임 해당 웹 페이지에서 언어 (language)와 관련된 데이터만 필요하다고 생각해 보자. 만약 태그로만 해당 데이터를 선택한다면, 태그 을 사용할 수 있다. 하지만 태그 에 언어 정보 뿐만 아니라 프로젝트 정보 (크롤링, 게임만들기)도 포함된다. 이러한 경우, 프로젝트 정보를 제외하고 언어 정보만을 특정하기 위해 선택자를 사용 파이썬 크롤링 c언어 게임 이렇게 class =..

생활코딩 html, css 맛보기로 몇 개만 골라서 들어보았다! HTML tag 대제목 소제목 글씨 강조 링크 걸어줌 속성 href = "링크" target="_blank" 링크 눌렀을 때 새로운 탭이 열리면서 그 탭에 페이지가 열리도록 하는 것 title="" 링크에 마우스 커서 올렸을때 문자 출력 각각의 항목을 list로 표현 list 그룹핑 unordered list 순서가 있는 그룹핑 ordered list 문서 자체를 꾸며줌, 부과적인 내용 (본문의 내용 X) 본문이 아닌 tag는 head 아래에 있어야함 링크 이름 글씨 깨질 때 이 코드 넣기 DOCTYPE document type declaration 내가 사용하고 있는 html이 어떠한 표준을 따르고 있는지 알려줌 현재 사용하는 것 CSS ..