잘 모름

HTML에는 태그가 정말 많은데 이걸 일일이 다 외우고 있을 수는 없다. MDN (Mozilla Developer Network)에 들어가면 HTML의 태그와 속성 사용법을 볼 수 있다. Technologies - HTML을 클릭하고 좌측의 References 클릭 보고 싶은 내용을 클릭하면 된다 나는 element references를 클릭했다 영어가 불편하면 오른쪽에서 한국어로 바꾸면 된다 나는 h1 태그를 눌러보았다 위와 같이 예시 코드가 뜬다 직접 입력해서 수정해볼 수도 있다.

웹사이트들을 보면 탭 부분에 아기자기한 아이콘들이 들어가있다. 내 html 파일은 그냥 문서 표시만 떠 있다. 나도 해보고 싶다 또 못생긴 오리를 그려봤다 저 못생긴 오리 그림 1.png라고 저장하고, html 파일이 있는 폴더에 넣는다

img 라는 태그가 있다. 말 그대로 이미지를 넣는 태그이다. self-closing 태그이다. 이미지를 넣고 싶으면 src라는 속성을 추가해준다. 이런거 없이 그냥 />로 끝내면 된다. src가 컨텐츠를 의미하기 때문이라고 한다. 위 못생긴 오리 그림으로 연습을 해보자 오리 그림에 오른쪽 마우스를 누르고 이미지 주소를 복사하자 img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FcLOqxp%2FbtqGmqlhqSn%2FZ4F4eroWX9DutDPKbDjKnK%2Fimg.png 이미지 주소는 위와 같다. 위와 같이 작성하고 파일을 열어보자 못생긴 오리가 잘 나온다. 인터넷에 돌아다니는 사진 ..

HTML에는 a 라는 태그가 있다 의미는 anchor-닻 이라고 한다.. anchor는 다른 웹사이트로 이동할 때 쓸 수 있다. https://dontknowwell.tistory.com> 이렇게 작성하면 그냥 이렇게 아무 효과도 없는 글자만 생성된다. 다른 사이트로 이동할거면 태그 속성을 추가해준다 href (hyperlink reference , http reference라고 한다) 라는 속성을 사용해보자. https://dontknowwell.tistory.com> 이렇게 코드를 작성하고 파일을 열어보면 마우스로 클릭할 수 있는 링크가 되었다. 태그 속성은 아무렇게나 작성해도 상관없다. 다만 아무일도 일어나지 않을 뿐.. 또한 태그마다 사용 가능한 속성이 다르다. div나 h1에 href 속성을 추..

HTML 태그 중에 list가 있다 ul과 ol 태그이기 때문에 사용은 로 한다 UL unordered list 순서가 없는 리스트이다 Number one Number two Number three Number four 우선 비교를 위해서 이렇게 작성을 하고 html 파일을 열어 확인해보았다. 글자 크기가 다르게 잘 작성 되었다. Number one Number two Number three Number four 이제 이렇게 작성하고 html 파일을 열어보았다. 앞에 공백만 조금 생겼다. 별 차이가 없는데?? list item을 의미하는 li라는 태그를 씌워주지 않아서 그렇다. 다시 해보자 Number one Number two Number two Number two 앞에 귀여운 동그라미가 생겼다. OL..

문서에 이런식으로 가 많아지면 헷갈린다 그래서 ID와 Class로 구별한다 ID - 고유함 Class - 중복 가능 로 사용 ID나 Class에 속성 부여할 수 있음 ex) Hello Hi 두개의 div를 만들어서 하나는 div1이라는 아이디를, 하나는 div2라는 아이디를 주고 class를 divclass라고 해줬음 divclass에는 공통적으로 글자 크기를 30px로 지정하고 id마다 배경색을 다르게 지정함 *class를 많이 사용한다고 한다.. (채팅 메세지 등등..)

태그의 종류 semantic 태그와 non-semantic 태그 semantic tags : 의미가 있는 태그 ex) : 헤더 1이라는 의미. : 섹션을 의미 non-semantic : 의미가 없는 태그 ex) : 아무 의미가 없음 같은 경우는 컨테이너, 박스와 같은 태그. 안에 내용물을 넣음 은 텍스트를 위한 컨테이너 - 제목에는 , 문단에는 를 쓰면 되는데 이런 경우가 아니라면 span 사용

HTML : Hyper Text Markup Language 프로그래밍 언어가 아님 마크업 언어 - 교과서에 밑줄 긋는다고 생각할 것 * 웹사이트에서 각 요소가 무엇을 뜻하는지 알려주는 언어. * 태그가 매우 많은 텍스트 문서 태그의 형식 : 내용 ex) 구글로 이동 구글로 이동 이렇게 하면 새 창에서 구글창을 띄움 - 문서가 html이라고 알려주는 태그, self-contained 태그라서 따로 닫을 필요는 없음 로 문서를 열고 닫음 - 웹사이트 이용자에게 보이지 않음. 브라우저에게 웹사이트에 필요한 정보를 제공 - 웹사이트 이름 바뀜 * meta : 추가 정보 : utf-8로 인코딩 - 웹사이트에 검색하면 "Hello"라는 간단한 설명이 나옴 - 검색하면 나오는 작성자 * 다양한 meta 태그가 존재..