본문 바로가기

Programming/2. Nomad Coder - 'HTML&CSS&JS'4

[HTML, CSS] 4. HTML, CSS 유용한 사이트 정리 (by Nomad Coders) 강의를 보며, 혹은 Slack을 통해 알게 된 몇 가지 사이트들 정리 이번 시간에는 노마드 코더 HTML&CSS 강의를 들으며 알게된 몇 가지 팁들이나 알면 좋은 사이트들을 정리해보고자 한다. 생각나는대로 이것저것 적어갈 예정이라 혹시 필요한 부분이 있다면 알아서 찾아가길 바란다. 유용한 사이트들 1. Animista CSS 애니메이션 효과를 주고 싶은데 간편하게 복사해서 주고 싶은 분들을 위한 사이트. 페이지에 들어가서 각 버튼들을 눌러보면 어떤 애니메이션 효과가 작동하는지 알 수 있다. https://animista.net/ Animista - CSS Animations on Demand Animista is a CSS animation library and a place where you can p.. 2021. 4. 21.
[HTML] 3. <form> 태그와 관련 태그들 정리 태그 입력 양식 (제출할 내용) 전체를 감싸는 태그 컨트롤 요소 (control elements) 로 구성되어 있음. (버튼, 텍스트 등) Attribute 1. autocomplete : 자동 완성 기능. on 으로 하면 전체에 자동 완성 기능 생성. 2. action : form이 전송되는 서버 url 또는 html 링크. 비밀번호나 아이디 등 정보가 전달될 링크라고 보면 된다. 3. method : 전송 방법 설정. get은 default, post는 데이터를 url에 공개하지 않고 숨겨서 전송하는 방법 4. name : form의 이름. HTML4부터 사용 중단됐고, id를 사용하라고 한다. 5. target : 데이터를 제출하면 결과를 어떻게 표시할 지 정하는 특성. _self 는 현재 페이지 .. 2021. 4. 20.
[HTML] 2. Netflix, Nomad Coder 홈페이지로 <meta> 태그 알아보기 태그 문서 그 자체를 설명하는 태그이다. 어떤 내용을 담고 있고, 그 문서의 핵심 키워드는 무엇이며, 누가 만들었는지, 언어 설정은 어떤 것을 사용하는지 등을 알 수 있다. Self-closing 태그이다. Netflix 페이지에서 사용된 태그 로 사용한다. utf-8 은 유니코드를 8비트로 인코딩한다는 뜻이며, 웹페이지를 만들 때 기본으로 쓰인다. 한글이나 다른 특수문자가 있는 언어를 입력할 때 브라우저가 이를 이해할 수 있게 함. 렌더링 모드를 설정함. 인터넷 익스플로러 버전을 지정하도록 하는데, 이제는 Edge만 남을 예정이라 다음과 같이 작성하면 된다. viewport : iOS에서 페이지를 표시할 때 사용하며, 창 크기를 바꿈 apple-mobile-web-app-capable : 웹응용프로그램.. 2021. 4. 13.
[HTML] 1. 노마드코더 HTML 강의 간단 요약 HTML 정리 ## 본 글은 노마드코더 코코아톡 클론 코딩 챌린지를 성공하기 위해 복습 겸 내용 정리를 위해 쓰는 글입니다. ## 웹사이트와 HTML HyperText Markup Language Hypertext란 '웹페이지를 다른 페이지로 연결하는 링크' 를 뜻한다. Markup Language는 문서의 논리 구조와 배치 양식에 대한 정보를 표현하는 언어이다. 문장과 그림, 표는 어떻게 배치되고 글자는 어떤 크기와 모양을 가지며, 들여쓰기와 줄 간격, 여백 등에 대한 정보를 포함한다. 일반적인 웹사이트는 2-3가지의 언어로 이루어져있다. (HTML, CSS, JavaScript) 브라우저에게 웹사이트의 content가 어떻게 이루어져있는지 설명할 때 사용한다. (뼈대) CSS는 웹페이지의 외형과 표현.. 2021. 4. 13.
반응형