👩🏻‍💻

웹페이지에서 오른쪽 마우스를 클릭한 후 검사를 클릭하면 위와 같은 개발자 도구가 열립니다. 코드에서 원하는 부분을 선택하고 오른쪽 박스에 마우스를 가져다 대면 해당하는 부분이 같은 색깔로 웹페이지에 표시되고, 이를 통해 원하는 부분의 여백이 어떤 값의 영향을 받고 있는지 분석해볼 수 있습니다. margin, border, padding 따라서 margin, border, padding, 파란색 부분인 content를 조정하면 원하는 레이아웃을 만들 수 있습니다. 1. margin : border 바깥의 공간으로, 다른 태그와의 거리를 나타냄 2. border : 테두리 3. padding : content와 border 사이의 공간으로, 글자와 테두리 사이의 간격을 설정 블록 레벨 요소와 인라인 레벨 요..

1. 전체 선택자 HTML 문서 내의 모든 태그에 같은 속성을 적용합니다. * { color: red;} 2. 태그 선택자 지정된 태그명을 가지는 모든 요소에 같은 속성을 적용합니다. p { color: red; } 모든 p 태그를 가지는 요소를 선택합니다. 3. 클래스 선택자 주어진 class 속성값을 가지는 모든 요소에 같은 속성을 적용합니다. .class1 { color: red; } div.class1 { color: blue; } paragraph 와 같이 class 속성값이 class1인 요소를 선택합니다. paragraph와 같이 div 태그이며, class 속성값이 class1인 요소를 선택합니다. paragraph 는 선택되지 않습니다. 4. ID 선택자 주어진 id 속성값을 가지는 요소..

댓글 기능 추가하기 Disqus https://help.disqus.com/en/ Disqus 15 articles in this collection Written by Ryan, Daniel Matteson, and Disqus help.disqus.com LiveRe https://livere.com/ 라이브리 간편한 사진/동영상 첨부 livere.com 채팅 기능 추가하기 tawk.to https://www.tawk.to/ tawk.to - "100% FREE live chat software for your website!" tawk.to is 100% free live chat software to monitor and chat with visitors on your website or from..

html 코드의 기본 구조 : 이 웹페이지가 html로 만들어졌다는 것을 표현 1. html : html 코드 전체를 둘러쌈 2. head : 본문을 설명 3. body : 본문 head 태그 안에 위치하는 태그 1. meta : 문서에 대한 metadata를 제공 charset, name, content 등의 속성을 가짐 닫는 태그가 없음 : 문서의 문자 인코딩 방식을 utf-8로 지정 2. title : 문서 제목 지정 웹브라우저의 탭에 표시되는 제목을 태그 안의 내용으로 바꿈 3. style : css를 이용한 스타일 지정 body 태그 안에 위치하는 태그 1. strong : 강조 강조할 문구 2. u : 밑줄 (underline) 밑줄 칠 문구 3. h1~h6 : 제목 숫자가 커질수록 글자가 작..