정데브의 코딩기록

2021.07.25 시작 WEB2 > CSS 수강 박스모델 16:21 그리드 9:54 반응형 디자인 9:17 CSS 코드의 재사용 11:48 수업을 마치며 2:59 학습내용 요약 - 태그는 한 단락을 다 가져감 반면, a태그로 감싼 문장은 해당 문장 범위만큼만 가져감 - 내부 스타일시트를 사용하여 안에서 h1{display: inline;} or a{display: block;} 할경우 두개의 본성을 사용자 마음대로 바꿀 수 있다. -display:none 을 통해 해당 태그 내용을 사라지게 할 수 있음 - h1,a{ 속성:값;} 컴마를 통해서 중복을 제거 가능 - border-width: 5px; border-color: red; border-style: solid; >> border:5px solid..

CSS란? (Cascading Style Sheets) - HTML문서의 스타일을 지정하는데 사용하는 언어 기본 문법 Selector{ Property: Value; Property: Value; .... } ✅ 용어 설명 -Selector : 선택자로 html문서의 각 요소들을 선택 - Property: 요소에 적용될 스타일 속성을 의미 - Value : 해당 속성의 값을 의미 예시) h2 태그에 색상은 레드, 글자 크기는 15px로 설정 (구분자로 ; 세미콜론 사용) h2{ color:red; font-size:15px; } ✅ CSS 주석 표기 방법 - 주석을 표시할 때는 /* ~ */ 사이에 내용을 입력하여 주석을 표시한다. ✅ 스타일 시트 적용 우선순위 : 인라인스타일 > 내부스타일 > 외부스타..

HTML에서 유일하게 움직일 수 있는 태그! 마키(marquee)태그에 대해서 알아보는 시간을 가져보도록 하겠습니다!😎 사용법 내용 1. 배경색, 높이 넓이 등의 속성 배경색 bgcolor / 높이 height / width 넓이 로 사용 움직이는 태그 2. direction 속성 움직이는 방향을 결정해주는 속성으로 up, down, left, right로 설정할 수 있다. (기본 값 : left) 위로 아래로 오른쪽으로 왼쪽으로 3. behavior 속성 행동의 형태를 지정하는 속성으로 scroll, alternate, slide로 설정할 수 있다. (기본 값 : scroll) 반복적으로 움직임 왔다 갔다 움직임 끝을 만나서 멈춤 4. scrolldelay 속성 마키 태그의 움직임에 대한 지연 시간을 ..

안녕하세요~~😁 정데브 입니다! 오늘은 !! 이전에 제가 혼자 작업해봤던 TO_DOLIST를 GitHub를 사용해서 web hosting으로 따로 웹서버를 구축하지 않고 홈페이지를 실행해보도록 하겠습니다! 차근차근 따라와보세요! 생각보다 쉬워서 놀랬습니당 💛 1. 깃허브 로그인 및 회원가입 https://github.com/ GitHub: Where the world builds software GitHub is where over 65 million developers shape the future of software, together. Contribute to the open source community, manage your Git repositories, review code like a pr..

2021.06.28 시작 WEB > WEB1-HTML&Internet 수강 원시웹 14:16 인터넷을 여는 열쇠 : 서버와 클라이언트 9:26 웹호스팅 (github pages) 13:02

2021.06.28 시작 WEB > WEB1-HTML&Internet 수강 문서의 구조와 슈퍼스타들 9:07 HTML 태그의 제왕 8:42 웹사이트 완성 8:36 학습내용 요약 - ~ 페이지 이름을 나타냄 - 로 문서를 읽어와라 - html문서임을 나타냄 - // // 로 구분지음 - ~ 링크를 통해서 텍스트와 연결 시킴 옵션 : target="_blank" 새탭 열기 title="~~~" 링크를 클릭하기 전 무엇인지 알려주기 위함

2021.06.28 시작 WEB > WEB1-HTML&Internet 수강 혁명적인 변화 12:16 통계에 기반한 학습 7:06 줄바꿈 7:34 HTML이 중요한 이유 9:38 최후의 문법 속성과 img 5:59 부모와 자식과 목록 10:08 학습내용 요약 - 단순 줄바꿈 태그로 닫는 태그가 불필요 함. (원하는 만큼 줄바꿈 가능) - ~ 한 달락을 구분해주는 태그 (정해져있는 여백만큼) - 태그와 태그사이의 여백을 margin (css 에서 사용) - ~ 는 리스트 형태로 목차를 구분해 줄 때 사용 (반드시 부모를 가짐) - ~ 는 의 부모태그 리스트를 구분할 때 사용 (반드시 자식을 가짐) (부정 =Unordered List) - ~ 는 순서가 있는 리스트 형태 (= Ordered List)

2021.06.28 시작 WEB > WEB1-HTML&Internet 수강 프로젝트의 동기 5:17 기획 1:49 코딩과 HTML 5:38 HTML 코딩 실습 환경 준비 10:12 기본문법 태그 9:17 학습내용 요약 - ATOM 설치 및 프로젝트 생성 - 밑줄 태그 - 강조 태그 새로운 에디터인 ATOM을 사용해보기로 했다. VSC와 상당히 비슷하지만 html로 만든 코드를 자동으로 페이지에 실행해주지 못하는 점이 아쉬운거 같다.

1. 글자 모양 변경 태그 기본 ... 속성 ... 문자의 크기, n=1에서 7까지의 숫자 ... 문자의 색상 ... 문자의 글꼴 2. 글자체 관련 태그 ... 볼드체 ... 한단계 큰 문자 ... 한단계 작은 문자 ... 이탤릭체 ...

1. - Line Break 의 약자로 강제로 줄바꿈을 의미 (종료태그 미사용) 2. - 입력한 내용 앞 뒤로 빈줄이 만들어짐 - 태그를 2번 사용하는 것과 같음 (종료태그 미사용) 3. - Horizon 의 약자로 선을 긋는 태그 - 분위기를 전환하는 용도로 사용 - size(두께) , width(가로넓이), align(정렬), noshade(음영효과 x) 등을 설정 할 수 있음. 4. - 문단을 중앙으로 정렬하는 태그 - ... 와 동일한 기능 5. - 한 문단을 나눌 때 사용 6. - 사용자가 입력한 그대로 브라우저에 나타냄 - HTML 문법에서 공백을 아무리 넣어도 하나밖에 표시되지않음. 공백을 표기하고 싶을때는 를 써줘야 함 7. - ,,,,,은 콘텐츠 영역에서 제목을 표시할 때 사용 - 하나의..