본문 바로가기

HTML5

[Javascript / Html / CSS] Typing Text (타이핑 텍스트 효과) 1. Html + CSS 꾸미기 타이핑 효과를 주기 전에 먼저 원하는 폰트와 원하는 text를 화면에 배치합니다. I'm Coding *{ box-sizing: border-box; margin: 0; padding: 0; font-family: 'Roboto', sans-serif; } .container{ height: 100%; height: 100vh; background: #32a89b; color: #fff; display: flex; justify-content: center; align-items: center; } .container h1{ font-size: 80px; } 이렇게 나오면 성공! 2. Typed JS를 설치 https://github.com/mattboldt/typed.j.. 2022. 10. 26.
[Html] Form - Input / Label / Radio & Checkbox / Select / Textarea / Button From Input input에는 무조건 type이라는 속성 값이 들어가야 함 placeholder : hintText minlength : 입력해야하는 단어의 최소 값 maxlength : 입력해야하는 단어의 최대 값 required : 필수로 입력해야 하는 input disable : 특정 input 값을 사용하지 못하게 함 value="치즈 도넛" : 기본으로 들어가는 값 (복사도 가능!) ** number의 최솟값과 최댓값을 적고 싶으면 min과 max를 사용해야 함 Enter your phone number: ** 확장자명을 정하고 싶다면 accept를 사용 Label : 폼 양식에 이름을 붙이는 태그 라벨 ** for은 '누구'를 위한 라벨인지 명시해줘야 함 -> for="input id" 이.. 2022. 6. 2.
[Html]인용 Quotations blockquote : 인용구 cite : 인용을 어디서 했는지 알려줌, 출처 q : 문장에 인용구가 있을 때 사용 (ex 두번째 코드에 예시가 있음) : ""를 쓰지 않아도 저절로 생성됨 우리가 겪을 수 있는 가장 아름다운 체험은 신비다. 신비는 모든 참 예술과 과학의 근원이다. 알버트 아인슈타인 **출처하는 사이트가 있다면 blockquote에 cite를 넣어준다 The study is the first to project the long-term outlook for Antarctica's largest penguins, which can grow 1.2 meters (four ft) tall, seeking to fill a gap in understanding climate change and .. 2022. 6. 1.
[Html] 목록 list List ol -- ordered list : 순서가 중요한 목록 (ex 요리법, 실시간 검색어 등등) ul -- unordered list : 순서가 중요하지 않은 목록 li -- list item : 리스트 아이템 **ol과 ul의 자식은 li만 올 수 있다 Description List -> 정의(서술) 리스트 dl -- description list dt -- description term : 서술된 용어 dd -- description data : 기술 자료 치즈 블로그 코딩을 공부하는 블로그 입니다 치즈 블로그 cheese-donut tistory 코딩을 공부하는 블로그 입니다 사과 사과에 대한 설명 바나나 바나나에 대한 설명 **dl의 자식 요소는 오직 div, dt, dd만 가능하다 2022. 6. 1.
[Html] 링크 anchor / 이미지 image anchor 1. 웹 URL 치즈도넛 블로그 바로가기 2. 페이지 내 이동 hello 섹션으로 이동! Title 3. 메일 보내기 메일 보내기 4. 전화하기 전화걸기 5. 새탭으로 열리기 새탭으로 열리기 image alt 란?! alternative text로 이미지가 나오지 않았을 때 대체해서 나오는 대체 텍스트 입니다!! 2022. 5. 31.