웹 개발 8

[웹 개발 기초] 웹 개발 8일차 (블록&인라인, 여백 겹침, 그림자 추가하기, 여백 값을 음수로 설정하기, 특정 텍스트 스타일링<span>)

https://dash758.tistory.com/12 [웹 개발 기초] 웹 개발 7일차 (CSS 박스 모델, HTML 구조, 선택자와 결합자, 클래스, 블록과 인라인)https://dash758.tistory.com/11 [웹 개발 기초] 웹 개발 6일차 (라이브 서버 적용, HTML의 목록, 스타일 다시 꾸미기)https://dash758.tistory.com/10 [웹 개발 기초] 웹 개발 5일차 (이미지 삽입 및 스타일링, 배경dash758.tistory.com지난 시간에는 컨텐츠가 갖는 공간인 CSS 박스 모델, 헤더 섹션과 메인 섹션을다룬 HTML 구조, 선택자와 결합자, 클래스, 블록과 인라인에 대하여 알아보습니다.이번 시간에는 블록&인라인, 블록 상에서만 발생하는 여백 겹침, 그림자 추가하..

[웹 개발 기초] 웹 개발 7일차 (CSS 박스 모델, HTML 구조, 선택자와 결합자, 클래스, 블록과 인라인)

https://dash758.tistory.com/11 [웹 개발 기초] 웹 개발 6일차 (라이브 서버 적용, HTML의 목록, 스타일 다시 꾸미기)https://dash758.tistory.com/10 [웹 개발 기초] 웹 개발 5일차 (이미지 삽입 및 스타일링, 배경 스타일링, 홈 페이지 완성 및 두 번https://dash758.tistory.com/9 [웹 개발 기초] 웹 개발 4일차(링크 스타일 :hover,dash758.tistory.com지난 시간에는 수정사항이 있으면 새로고침을 통해 즉각적으로 웹 사이트에 반영하는 Live Server 익스텐션과 HTML에서 목차를 소개하는 방법, 웹 사이트를 조금 더 꾸며보았습니다.이번 시간에는 CSS 박스 모델, HTML 구조, 선택자와 결합자, 클래스..

[웹 개발 기초] 웹 개발 6일차 (라이브 서버 적용, HTML의 목록, 스타일 다시 꾸미기)

https://dash758.tistory.com/10 [웹 개발 기초] 웹 개발 5일차 (이미지 삽입 및 스타일링, 배경 스타일링, 홈 페이지 완성 및 두 번https://dash758.tistory.com/9 [웹 개발 기초] 웹 개발 4일차(링크 스타일 :hover, 외부 CSS파일 참조하기, ID 선택자, 폰트 굵기, 크https://dash758.tistory.com/8와 href, 글로" data-og-description="https://dash758.tistory.com/7,dash758.tistory.com지난 시간에는 이미지를 삽입하는 태그와 이미지 스타일링, 배경 스타일링, 홈 페이지 완성 및 두 번째 페이지 만들고, 공유 CSS 파일과 상대 경로 지정하는 방법에 대해 알아보겠습니다..

[웹 개발 기초] 웹 개발 5일차 (이미지 삽입 및 스타일링, 배경 스타일링, 홈 페이지 완성 및 두 번째 페이지 만들기, 공유 CSS 파일, 상대 경로 지정)

https://dash758.tistory.com/9 [웹 개발 기초] 웹 개발 4일차(링크 스타일 :hover, 외부 CSS파일 참조하기, ID 선택자, 폰트 굵기, 크https://dash758.tistory.com/8와 href, 글로" data-og-description="https://dash758.tistory.com/7, , CSS로 폰트 변경, 글자 중앙 정렬, 색상 바꾸" data-og-description="지난번에는 메모장을 이용하여 소스 코드를 작성한 후dash758.tistory.com지난 시간에는 하이퍼링크의 스타일을 바꿔주는 :hover, 외부 CSS파일 참조하기, ID 선택자, 폰트 굵기, 크기, 구글 폰트를 통한 폰트 변경, 꺾쇠 기호() 출력에 대하여 알아보았습니다.이번 ..

[웹 개발 기초] 웹 개발 4일차(링크 스타일 :hover, 외부 CSS파일 참조하기, ID 선택자, 폰트 굵기, 크기, 모양 변경, 꺾쇠(< , >)기호 출력)

https://dash758.tistory.com/8와 href, 글로" data-og-description="https://dash758.tistory.com/7, , CSS로 폰트 변경, 글자 중앙 정렬, 색상 바꾸" data-og-description="지난번에는 메모장을 이용하여 소스 코드를 작성한 후 웹 사이트를 만들어 보았습니다. 이제부터는 편한 작" data-og-host="dash758.tistory.com" data-og-source-url="https://dash758.tistory.com/8" data-og-url="https://dash758.tistory.com/8" data-og-image="https://scrap.kakaocdn.net/dn/j16df/hyWSbKRTyC/iB..

[웹 개발 기초] 웹 개발 3일차 (유용한 Extension, 다양한 색상 지정 방법, 앵커 태그 <a>와 href, 글로벌 CSS 스타일 지정, HTML 형태, 제목 짓기, 주석 처리)

https://dash758.tistory.com/7, , CSS로 폰트 변경, 글자 중앙 정렬, 색상 바꾸" data-og-description="지난번에는 메모장을 이용하여 소스 코드를 작성한 후 웹 사이트를 만들어 보았습니다. 이제부터는 편한 작업과 오타를 없애기 위해 Visual Studio Code에서 코드를 작성하겠습니다. 실행 방법은 똑" data-og-host="dash758.tistory.com" data-og-source-url="https://dash758.tistory.com/7" data-og-url="https://dash758.tistory.com/7" data-og-image="https://scrap.kakaocdn.net/dn/cvVj9B/hyWVXRzTgh/LhaudNO..

[웹 개발 기초] 웹 개발 2일차(HTML 기본 태그, <h1>, <p>, CSS로 폰트 변경, 글자 중앙 정렬, 색상 바꾸기)

지난번에는 메모장을 이용하여 소스 코드를 작성한 후 웹 사이트를 만들어 보았습니다. 이제부터는 편한 작업과 오타를 없애기 위해 Visual Studio Code에서 코드를 작성하겠습니다. 실행 방법은 똑같습니다. 폴더를 만들고 파일을 만들 때 확장자를 .html로 붙이면 끝입니다.     지난번에 태그에 대하여 알아보았습니다. 태그는 제목과도 같은 역할을 하는 태그라고 하였습니다. 지난주에는 태그 안에 Hello World! 라고 작성하였습니다. 이번에는 목표를 도와주는 프로그램을 만들기 위하여Max Challanages started at 8.23 Thr 이라고 작성해보겠습니다.  그 후 오늘의 목표인 HTMl과 CSS의 사용법을 이해하는 것을 문단으로 작성해 볼 것입니다. HTML 태그 중 문단을 작..

[웹 개발 기초] 웹 개발 1일차 (웹 사이트 작동 방식, 웹 관련 주요 언어, IP 주소와 도메인, DNS 서버, 웹 사이트 만드는 법, HTML)

해킹 분야에 관심이 있어 하고, 그 중 웹 해킹에 대해 배우고 싶기 때문에 본격적인 해킹을 공부하기 전 웹 사이트를 직접 만들어 봄으로써 웹이 어떠한 방식으로 작동을 하는지, 어떠한 부분에서 취약점이 발생을 하는지 등을 알아보겠습니다. 가능하다면 총 100일동안 진행이 될 것 같습니다. 웹 개발 기초의 목표는 HTML, CSS, JS에 대해 어느정도 기초를 다지고, 이들을 활용하여 어느정도 건실한 웹 사이트라고 불릴만한 목표를 달성할 수 있도록 도와주는 웹 사이트를 제작하는 것이 목표입니다.    웹은 어떻게 작동할까? 만약 네이버에 접속하고 싶어서 검색창에 '네이버'를 입력했습니다. 이때, 우리의 컴퓨터에서 네이버의 서버 컴퓨터에 방문하고 싶다는 요청을 보냅니다. 우리가 네이버의 서버에게 요청을 보냈으..