오늘 수강한 강의 : 【한글자막】 100일 코딩 챌린지 - Web Development 부트캠프오늘의 강의 정리 📗HTML CSS 레이아웃 및 포지셔닝text 스타일링margin 축소(중복)인접 요소끼리만 margin 축소 현상이 일어나는게 아니라, 부모자식 요소 사이에서도 margin 축소가 일어남.선형 그라디언트linear-gradient( to right, yellow 50%, red 60%, purple )positionstatic : (default) 요소를 일반적인 문서 흐름에 따라 배치차례대로 왼쪽에서 오른쪽, 위에서 아래로 쌓임relative : 요소를 일반적인 문서 흐름에 따라 배치하고, 자기 자신을 기준으로 top, right, bottom, left의 값에 따라 오프셋 적용abso..

HTML & CSS 자세히 알아보기오늘 수강한 강의 :  【한글자막】 100일 코딩 챌린지 - Web Development 부트캠프 css 코드 서식인라인 스타일을 사용하지 않을 때(style 속성을 통해) CSS 코드는 일반적으로 다음과 같다.p { font-family: sans-serif; text-align: center;}이 코드는 읽기 쉽게 작성되어 있다. 하지만, 반드시 위처럼 작성해야 하는 것은 아니며, 이론적으로는 아래와 같이 작성할 수도 있다.p {font-family: sans-serif;text-align: center;}그러나 위와 같은 코드는 이해하고 유지 관리하기가 훨씬 더 어렵기 때문에 일반적으로 읽기 쉽게 작성한 맨 위의 서식처럼 작성한다. 다음은 CSS 코드 형..

웹 개발 기본과 HTML&CSS오늘 수강한 강의 : 【한글자막】 100일 코딩 챌린지 - Web Development 부트캠프웹(WEB)이란?World Wide Web의 줄임말로 사용됨.전 세계의 컴퓨터들을 네트워크로 연결하여 "정보를 공유"하는것을 목표로 함.컴퓨터들을 인터넷으로 연결하는 여러 서비스들 중 하나가 바로 웹(Web,www).www.google.com을 검색하면 벌어지는 일HTTPHTTP(Hyper Text Transfer Protocol)웹상에서 정보를 가져와 화면에 출력하기위해 사용하는 통신규약 중 하나인터넷에서 HTML 문서와 같은 데이터를 주고받을 수 있도록 해주는 프로토콜.기존 TIL 참고 :HTTP/1.0, HTTP/1.1, HTTP/2, HTTPS, H..

1. 선택자란? - 특정 항목(HTML)을 선택하여, 해당 항목의 속성을 변경. 1) tag 선택자 : 특정 태그(HTML)를 선택하여, 해당 태그의 속성을 변경. 선택자(특정 태그 명) + { 설정 } 제목입니다 본문입니다 제목입니다 본문입니다 또 하나의 DIV 입니다 2) 다중 태그 선택 : 여러 태그를 선택하여, 해당 태그의 속성을 변경 선택자,선택자,선택자 + { 설정 } cf) 특정 태그에 다중 설정시 가장 마지막으로 설정된 값으로 홈페이지 반영됨. MY HOMEPAGE HTML5 CSS3 JAVASCRIPT JQUERY What is HTML5? HTML5 is goooooooooooooooooooooooooooooooooooooooooooooooooooooooood! xxx주식회사 서울시 0..

1. 폼을 통해 정보를 입력받는 태그 웹사이트에서 회원가입 등 여러 정보를 입력받아 웹 서버로 전달할 때 사용하는 폼을 만들어주는 태그 1) form 태그 - 폼 안에 있는 모든 데이터를 백엔드 서버에 전달한다. - 전체 양식 설정(화면에 보이지 않지만 양식을 지정해줌) 1-1) form 태그 필수속성 (1) action 속성 ① form data를 서버로 보낼 때 해당 데이터가 도착 할 URL을 명시 (2) method 속성 ① get : 디폴트 값. 도메인에 입력값이 문서헤더에 그대로 보임 - 보안에 취약 ② post : 파일 헤더에 정보값이 암호화되어 저장되어, 도메인에는 변화가 없음 - 보안이 필요한 부분에 사용. 로그인 값 등에 사용 2) input 태그 - 실질적으로 데이터를 입력받을 양식을 ..

1. 동영상을 출력하는 태그 1) video 태그 - 종료태그 있음 2) video 태그 필수 속성 (1) src(source) 속성 : 비디오 소스(경로/URL) 제공 (2) type 속성 : video/확장자명 cf: 필수 속성과 기타 속성은 아래처럼 별도로 작성 할 수 있음 3) video 태그 기타 속성 (1) controls 속성 : 컨트롤러 제공(소리조절, 동영상 탐색, 일시정지, 재시작) (2) autoplay 속성 : 자동 재생

1. 이미지를 나타내는 태그 웹사이트에서 이미지를 출력해주는 태그 1) img(image) 태그 : 이미지 출력을 위한 태그 - 별도의 종료 태그 없음 2) src(source) : 이미지 파일의 경로 표시 / img 태그 필수속성 - 사이트 파일 내에 위치한 이미지 파일의 경로 - 원격지에 위치한 파일 3) img 태그 기타 속성 (1) alt(alternate) 속성 : 이미지 파일이 없을 시 교체(대신)하여 출력할 문구 (2) width 속성 : 너비(가로 길이) (3) highth 속성 : 높이(세로 길이) (4) border 속성 : 경계선 설정(사각형 모양) 및 굵기 (5) alt 속성 : 그림 설명(그림 위에 포인터 위치시 풍선 도움말) (6) (2)~(5) + align, hspace, v..

1. 리스트 태그란? 여러 정보의 목록을 만드는 태그 1) ul : 순서가 없는 리스트(unordered list) 순서가 없는 리스트 menu1 menu2 menu3 menu4 menu5 2) ol : 순서가 있는 리스트(ordered list) 순서가 있는 리스트 서울 경기 충청 전라 경상 강원 - start : 의 시작 값 설정 순서가 있는 리스트 5 서울 경기 충청 전라 경상 강원 - type : 의 인덱스 값 설정. 1 / a / A / i / I (기본값 = 1) 순서가 있는 리스트 i menu1 menu2 menu3 menu4 menu5 순서가 있는 리스트 a 가지 나비 다리 라면 마늘 3) dl, dt, dd : 정의 목록 태그 - (definition list) : 정의 목록 - (def..

1. 태그란? - HTML을 구성하고있는 요소. - : 열린 태그 (시작) - : 닫힌 태그 (종료)

(참조 : https://www.inflearn.com/course/html-css-%EA%B0%95%EC%A2%8C/lecture/514) 실전 HTML & CSS 강좌 - 인프런 | 학습 페이지 지식을 나누면 반드시 나에게 돌아옵니다. 인프런을 통해 나의 지식에 가치를 부여하세요.... www.inflearn.com 1. WEB 이란? web이란, 사전적 의미로 거미줄이란 뜻으로 IT에서 WWW(World Wide Web)라는 말의 줄임말로 사용된다. 그 주목적은, 전 세계의 컴퓨터들을 네트워크로 연결하여 정보공유를 하는데 있다. 그리고 컴퓨터들이 연결되어있는 상태를 네트워크에 연결되어 있다고 표현한다. 네트워크, 즉 인터넷으로 컴퓨터들을 네트워크에 연결하는 여러 서비스들 중 하나가 웹(Web, WW..