display속성 block, inline, inline-block 정리  1. display: block;: block 요소의 의미는, 이 요소 바로 옆(좌우측)에 다른 요소를 붙여넣을 수 없다는 뜻입니다.블록 속성을 가지고 있는 태그는 기본적으로 너비 100% 속성을 가지고 있습니다.화면의 가로 폭을 100%로 완전히 차지하기 때문에, 다음 요소가 양 옆으로 붙을 공간이 없어서 자연히 줄 넘김이 된다.따라서 display 속성이 block으로 지정된 엘리먼트는 전후 줄바꿈이 들어가 다른 엘리먼트들을 다른 줄로 밀어내고 혼자 한 줄을 완전히 차지합니다.예를 들어서 p, li, div, h1 등이 모두 block 요소에 해당하는 태그들입니다.  inline 요소와 다르게 margin, pedding, w..

[CSS] Position 속성   https://developer.mozilla.org/en-US/docs/Web/CSS/position position - CSS: Cascading Style Sheets | MDNThe position CSS property sets how an element is positioned in a document. The top, right, bottom, and left properties determine the final location of positioned elements.developer.mozilla.org    CSS position 속성 : CSS에서 position 속성은 HTML 문서 상에서 요소가 배치되는 방식을 결정합니다.position 속성은..

HTML 링크, 미디어 태그 (이미지, 오디오, 비디오)     https://developer.mozilla.org/ko/docs/Web/HTML/Element/a - HTML: Hypertext Markup Language | MDN" data-og-description="HTML 요소(앵커 요소)는 href 특성을 통해 다른 페이지나 같은 페이지의 어느 위치, 파일, 이메일 주소와 그 외 다른 URL로 연결할 수 있는 하이퍼링크를 만듭니다. 안의 콘텐츠는 링크 목적지" data-og-host="developer.mozilla.org" data-og-source-url="https://developer.mozilla.org/ko/docs/Web/HTML/Element/a" data-og-url="..

HTML 태그 종류 및 개념정리  https://www.w3schools.com/html/html_forms.asp HTML FormsW3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.www.w3schools.com   : 입력 양식 전체를 감싸는 태그폼은 사용자와 웹사이트 또는 어플리케이션이 서로 상호 작용하는 것 중 중요한 기술 중에 하나이다. 폼은 사용자가 웹사이트에 데이터를 전송해주기도 하며 이밖에 ..

HTML 테이블 태그   https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table: The Table element - HTML: HyperText Markup Language | MDN" data-og-description="The HTML element represents tabular data—that is, information presented in a two-dimensional table comprised of rows and columns of cells containing data." data-og-host="developer.mozilla.org" data-og-source-url="https://developer.mozilla..

HTML 목록(리스트) 태그  : 순서가 없는 리스트 (Unordered List)순서가 없기 때문에 앞에 ●과 같은 불릿이 붙는다CSS에서 list-style: none; 으로 순서 표시 없앨수 있음  : 순서가 있는 리스트 (Ordered List) 태그와 달리 태그는 기호가 아닌 숫자나 영문 순서가 들어감사용할 수 있는 속성들이 있다 속성!! 1) type="  "1숫자(기본값)a영어 소문자A영어 대문자i로마숫자 소문자I로마숫자 대문자 2) start="  "(중간 부터 시작하고 싶을때): list item 태그와 태그 안에서 각 항목을 나열할 때 사용한다    마지막으로 , , 모두 쓰이는 예제 목록1 목록2 목록1 목록2 목록3 목록3-1 목록..

HTML5의 기본요소시작태그 속성1="속성값" ...속성n="속성값">내용종료태그>  글자/폰트 관련 태그 : 제목 태그까지 있다 - 숫자가 커질수록 폰트 크기는 작아진다.h를 사용한 것과 같게 보이는 태그들 도 많지만 태그를 사용한다는 것은 제목이 된다는 정보를 준다는 것이기 때문에 다른 내용과 구별해서 사용해야 된다.: 긴 가로선 표시----------------------------- 실선으로 표시:  줄 바꿈 태그를 그 맨뒤에 붙이면 삽입된 위치에서 줄이 바뀐다. ( 닫는 태그 x): 단락, paragraph태그를 사용하면 사용한 앞, 뒤로 빈 줄이 생기면서 단락이 생긴다.: 기울임 태그로 감싸진 내용을 기울임 꼴로 표현한다.: 기울임 태그보다 더 강조되고 중요한 태그이다.기울임 꼴로 표현한다.:..

맥OS에서는 homebrew라는 커멘드가 있습니다.homebrew는 CLI환경에서도  커멘드를 쓰면 외부에 있는 프로그램을 설치하는게 가능 합니다. 설치 방법1. homebrew 홈페이지 들어가준다.https://brew.sh/ HomebrewThe Missing Package Manager for macOS (or Linux).brew.sh 2. 터미널에 복사, 붙여넣고 실해하면 설치 끝 /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" 3. 실행하고 brew help명령어 실해해봤는데 아래와 같이 사용불가능 하다고 한다.Warning: /opt/homebrew/bin is not ..

https://doit-fwd.tistory.com/10 태그와 오픈 그래프(Open Graph)" data-og-description="오픈 그래프 프로토콜이란 SNS에서 특정 웹 페이지를 공유하면 짤막한 미리보기 화면이 나타나면서 마치 그 SNS의 게시물인 것처럼 자연스럽게 삽입됩니다. 어떻게 그럴 수 있을까요? 이것은 바" data-og-host="doit-fwd.tistory.com" data-og-source-url="https://doit-fwd.tistory.com/10" data-og-url="https://doit-fwd.tistory.com/10" data-og-image="https://scrap.kakaocdn.net/dn/bUzIWz/hyVADtu6mO/Do1OyBx3pSkiKMV..