[html] 반응형 html 페이지
2021. 9. 7. 19:58
programming/HTML, CSS
예전에는 데스크톱용 홈페이지만 만들었다고 하면 지금은 다양한 디바이스가 있습니다. .left { float:left; width:50% } .right { float:right; width:50% } html에서는 예전과 달리 고정된 px을 사용하지 않고 Flex grid %, Flex box vw, vh를 사용해서 구현합니다. 추가로 css에서 Media Queries를 이용해 모바일, 태블릿, 데스크톱 화면을 어떻게 보여줄 것인지 구성할 수 있습니다. 그래서 데스크톱, 태블릿, 모바일 화면을 생각하면서 만들어야 합니다. @media screen and (min-widht: 800px) { .container { widht: 50%; } }
[html] html 기본
2021. 8. 21. 14:15
programming/HTML, CSS
html은 브라우져에서 실행 가능한 가장 기본적인 파일입니다. - 상위태그 head -> 상세 설명이 들어가는 태그 body -> 사용자에게 보여지는 태그들로 이루어져 있는 태그 참고 사이트 https://developer.mozilla.org/ko/ MDN Web Docs The MDN Web Docs site provides information about Open Web technologies including HTML, CSS, and APIs for both Web sites and progressive web apps. developer.mozilla.org 전세계의 많은 웹개발자들이 확인하고 예제를 통해서 배우는 곳입니다. (html, css, javascript 등) * 예전에는 div로 ..
[Emmet] Emmet 빠르게 마크업 하기 1
2021. 8. 1. 02:42
programming/HTML, CSS
Visual Studio Code에서 HTML 마크업을 할 때 ! 를 입력하면 emmet 이라는 내용이 나오면 엔터를 치면 HTML 기본 마크업이 실행된다. - div class 를 작성할 때는. 클래스 이름을 입력한다. - div id 를 만들고 싶을 때는 #id이름을 입력한다. - div 안에 ul 안에 li를 생성하고 싶을 때는 > 마크업으로 진행 - div 안에 ul 과 ol를 나란히 만들고 싶을 때는 +를 이용 - ul 안에 li를 7개 만들고 싶다면 * 사용 ul 안에 li가 있는데 ul 과 나란히 ol을 넣고 싶을 때는 ^ 를 사용한다. *드림 코딩 엘리님의 youtube를 보고 개인적인 공부를 위한 포스팅입니다 ^^ 원본을 보실 분은 밑에 클릭 해 주시면 돼요 ^^ https://www.y..