일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- 가상클래스 선택자
- vmax
- JavaScript
- 즐거운 자바
- optgroup
- 부스트코스
- 김성박
- 자바
- EDWITH
- nth-of-type()
- 소스트리
- 다시보자
- ES6
- nth-child()
- 다시볼 것
- 상속
- 웹개발
- 깃헙
- jsp
- 복합 선택자
- 부정 선택자
- spring
- HTML Templating
- 서블릿
- datalist
- 가상요소 선택자
- 속성 선택자
- 보충필요
- vmin
- 즐거운자바
- Today
- Total
목록HTML (7)
기억의 DataBase
target : submit 시에 action 페이지를 현재 탭(_self)에 띄울지 새로운 탭(_blank)을 띄울지 autocomplete : 이전 입력값을 통한 자동완성 기능을 사용할 것인지 설정 novalidate : input 타입에 따른 유효성 검사를 무효화(test 단계에서 활용) type="file" + multiple : 복수의 파일을 입력할 수 있음 autofocus : 페이지가 열렸을 때 자동 focusing(로그인 시 ID에 활용하면 좋을 듯) form : form 밖에 input을 사용할 경우, id를 명시하여 submit시 같이 전송 / reset 미적용 동의하십니까? 동의하십니까? label : 체크박스와 같은 경우에서 label에 포함되어 있는 text를 선택해도 체크가 되도..
controls : 위와 같은 조작 메뉴를 띄움 autoplay : 해당 페이지에 접속하면 자동 재생 loop : 반복재생 muted : 음소거 상태에서 시작 preload : 실행전 가져올 data(metadata가 무난) poster : 재생전 썸네일 이미지 width/height : 영상 창 크기 지정 나머지는 audio와 동일 외부 사이트의 컨텐츠를 가져오는 것으로 유튜브의 경우 동영상에 우클릭을 하면 iframe 정보를 주므로 그대로 붙혀넣으면 된다. (일부 사이트는 불가)
파일 등의 기본 경로를 지정 한 html에 하나만 사용가능 (prefix와 유사 - 잘 못 쓰면 꼬일 것 같기도...) h태그를 가지고 글자 크기를 조절하는 것 지양 (CSS로 하는 것이 바람직 - html은 구조만을 규정) h1~h6까지 순서대로 쓰는 것이 좋으며 h1은 한번만 사용을 권장한다. 빈tag 형식과 그냥 tag 형식 모두 가능 (가급적 한가지로 통일) html 상의 줄바꿈 = 브라우저 띄어쓰기 줄 바꿈은 (줄 간격을 주기위해 사용 X) html상에 작성한 text를 보여지는 그대로(띄어쓰기, 줄바꿈) 브라우저에 보여주고 싶을 때 태그 사이에 인용문을 적고 cite에는 인용문 원본 URL 정보를 적시 cite를 속성이 아닌 tag로 쓸때는() 책, 영화, 음악 등의 작품명을 명시할 때 사용 ..
division(분할, 구분)의 약자로 구역을 나누는 block 요소다. (막 쓰기 좋다.) 문서, 기사라는 단어 뜻처럼 컨텐츠 구역을 의미하며 주로 독립성(단독 재사용 가능) 있는 컨텐츠에 사용된다. 제목 요소(h1, h2 등)를 포함하고 있으며 컨텐츠 등의 집합을 포함할 때 사용된다. 사실 3가지 모두 퉁쳐서 로 작성해도 눈에 보이는 차이는 없다. (기기마다 차이가 있으려나...?) html은 semantic(의미론)하게 작성해야 한다는 말을 들은 적이 있다. 더 공부하다보니 알게 된 위 문장의 의미는 개발자와 검색엔진 등을 위해 각 요소들을 의미에 맞게 사용해야 한다는 것이다. 사실 보이는 내용만 생각하면 , , 만으로 대부분의 text 관련 html을 작성할 수 있을지 모른다. 하지만 각 text..
블록요소(div, h1, p, section, nav...) 1) 사용가능한 최대 가로 너비를 사용(width: 100%; height: 0;) 2) 크기 지정이 가능 3) 수직으로 쌓임 4) margin, padding이 상하좌우 모두 적용 가능 5) 레이아웃을 위한 용도 인라인요소(span, img, a...) 1) 필요한 만큼의 너비만 사용(내용이 있는 만큼만 사용) 2) 크기 지정이 불가 3) 수평으로 쌓임(수직으로 작성하면 띄어쓰기 발생) 4) margin, padding이 좌우만 적용 가능(상하는 미적용) 5) Text를 위한 용도 ※display: block/inline으로 변경 가능
VScode에서 파일 종류를 *.html로 저장하고 나서 빈 에디터에 ! + Tab/Enter를 입력하면 나오는 HTML 요소들은 위와 같다. (기본 틀은 굳이 타이핑 할 필요 없다...) head 요소들을 몇가지 추가 해보았다. 웹브라우저 탭 아이콘은 파비콘(Favicon)이라고 하는데 즐겨찾기 시에도 추가되는 이미지라 하니 웹사이트 대표 아이콘이라 할 수 있겠다. 파비콘 이미지 파일은 *. ico 형식으로 해야 IE에서 지원한다고 하니 신경 쓸 부분이다.