HTML

    TIL 16 :: css할 때 고려해야할 것

    TIL 16 :: css할 때 고려해야할 것

    CSS 설계 기법 HTML은 최대한 단순한 구조를 짜는게 좋듯이 CSS도 코드의 중복이 없도록 모듈화를 시키는것이 유용하다. 그래서 같은 button들이라면 .btn .btn1 이렇게 만들어 .btn에는 공통적인 속성을 주고 .btn1에는 각 버튼별 속성을 추가해주는식으로 한다. OOCSS (Object Oriented CSS)가 앞서 설명한 방식으로 레고처럼 버튼, 글자, 내용 부분들을 모듈화 해놓고 조합하는 방법론이다. 모듈화의 장점은 홈페이지를 제작할 때 공통속성을 한번의 작업만 하면 된다는 것이다. 굳이 각각 작업해서 맞추는게 아니라 같은걸 사용한다면 수정이나 시간절약에 좋을것이다. 그리고 css에서 동일한 이름을 정하기도 하는데 이건 회사마다 다르다고한다. 아래 사진은 참고용으로 좋다. 더보기 ..

    Grouping Content란? <div> 만 쓰는거 금지..!

    Grouping Content란? <div> 만 쓰는거 금지..!

    ✍Grouping Content : 무엇인가를 감쌀 때(그룹화 할 때) 사용하는 태그의 명칭 HTML 구조를 처음에 짤 때는 무조건 그룹핑할때는 ! 라는 생각으로 범벅을 시켜놨었다. 하지만 배울수록 이건 잘못되었다는걸 알았다.. (처음에 만든 코드들 보면,, 한숨만) Sementic Tags를 지킨다고 생각하면 될 것 같다. 쉽게 이야기하자면, 수십 수백 줄이 되는 코드를 보면서 어느 부분이 네비게이터인지 어느 부분이 본문인지 한 눈에 이해할 수 있게 해준 방법이라 생각한다. 🔎 Semantic Tags란? : '의미가 있는 태그'라는 뜻이다. 즉, HTML tag들 중에서도 나름의 의미가 있는 태그들이다. (자세한 내용은 아래 링크에서 확인할 수 있다.) https://www.w3schools.com/..

    [HTML] HTML Living Standard란?

    [HTML] HTML Living Standard란?

    HTML5는 처음 개발 공부할때부터 들어왔고 로고로도 굉장히 익숙하다. 그런데 수업 중 HTML Living Standard를 HTML5라고 지칭하는게 옳지 않다고 하셔서 그 이유에 대해 정리해보았다. 🚩 HTML Living Standard란 ? 버전 숫자와는 상관없이 HTML 문법 등을 규정한 표준으로, 버전이라는 개념을 사용하지 않고 유동적으로 계속 업데이트한다는 의미이다. 현재 WHATWG에서 HTML5를 현존하는 LIving Standard로서 인정하고 있기 때문에 HTML5와 혼동하여 사용되기도 한다. WHATWG 에서도 확인할 수 있다. 1.2 Is this HTML5? The HTML Living Standard (sometimes informally called HTML5). The HT..

    [HTML,CSS] 태그, 선택자 정리 사이트!

    [HTML,CSS] 태그, 선택자 정리 사이트!

    HTML, CSS를 공부하다 보면 느끼시겠지만 태그들이 찾으면 찾을수록 많이 존재합니다. 수많은 태그들이 존재하는데 그러면 모든 태그를 외워야하는건가? 라는 저처럼 고민하시는 분들이 계실 것 같아 정리가 잘 되어있는 사이트를 소개합니다. 특히 html, css를 처음 접하시는 초보자들에게 추천합니다 :) 1. HTML5 Tag Dictionary - https://opentutorials.org/module/552/4786 : 각 태그마다 정의와 설명, 그리고 예제를 같이 보여주기 때문에 이해하는데 더욱 도움이 됩니다. 2. CSS Dictionary - https://opentutorials.org/module/441 : W3C의 내용을 기본으로 만들어졌으며 예제들을 이미지와 jsfiddle 서비스를 ..

    [HTML] 웹 개요(주의사항, 기본구조)+VSCODE 설치

    [HTML] 웹 개요(주의사항, 기본구조)+VSCODE 설치

    ✍인터넷 : 전 세계의 컴퓨터들이 네트워크를 통해 연결되어 정보를 공유하는데 목적을 두며 프로토콜을 이용하여 통신 초기에는 군사용과 민간용으로 구분되었고 민간용이 지금의 인터넷이 되었다. ✍웹(WEB) : 인터넷에 연결된 컴퓨터를 통해 사람들이 정보를 공유할 수 있는 공간 인터넷의 통신망 위에서 작동하는 서비스 -역사 : 팀 버너스리가 하이퍼링크(Hyper Link)를 포함하는 문서의 개념 제안 월드 와이드 웹(WWW)을 개발 및 배포 웹 표준 단체 W3C 창설 ✍웹 표준 : 모든 브라우저에서 웹 서비스가 정상적으로 보여질 수 있도록 하는 것 - 각기 다르게 보여지면 사용자만 피해본다 표준안으로 HTML5를 웹 표준으로 권고  MS는 잘 안 따르는 반면 타사는 적극적으로 받아들임  MS 신 버전은 웹..