HTML 썸네일형 리스트형 [HTML] Semantic(시멘틱) Tag(태그)와 Web(웹) 시멘틱 웹은 의미론적인 웹이란 뜻이다 시멘틱 웹 = 의미 있는 웹 시멘틱 태그 = 의미있는 태그 과거 또는 현제 div(디비전)이라 하는 태그를 이용하여 마크업의 영역들을 구분해 왔는데 최근에 들어 사용자가 사용하기에 검색엔진과 같은 찾는 수단의 정확도가 중요해지면서 시멘틱 태그를 사용하여 개발을 하는 경우가 많이 있다 시멘틱 태그 적용 전 중요한 제목 입니다 중요한 내용 입니다 시멘틱 태그 적용 후 중요한 제목 입니다 중요한 내용 입니다 영역이 가지고 있는 확실한 의미를 부여함으로써 개발환경에 있어 관리에 용이함은 물론 사용자에게 있어도 검색엔진 등 정확도를 올려줄 수 있다는 점이다 예를 들어 HTML의 img태그와 CSS의 background-image를 통해 이미지를 넣는다고 가정할 때 둘의 차이점.. 더보기 [HTML / CSS] Bootstrap 부트스트랩 사용법 간단 https://getbootstrap.com/ Bootstrap The most popular HTML, CSS, and JS library in the world. getbootstrap.com 1. Get Started 클릭 2. Starter template 코드 복사 3. 코드 작성 끝 bootstrap은 css랑 html 짜기 겁나 귀찮고 디자인 감각 없는 우리가 자주 사용하는 라이브러리임 다 꾸며주고 다 꾸며놓음 코드 붙이고 쓰기만 하면 됨 그거마저 귀찮은 당신 Hello, world! 이것도 귀찮은 당신 head에 넣고 코드시작하면 됨 jquery cdn은 따로 import 시켜야 제이쿼리 사용 가능 더보기 [HTML] Emmet (div박스 여러 개 만들기) ! VS CODE를 기준으로 작성됨 우리는 보통 html에서 div태그를 여러 개 만들어 쓰는 경우가 많다 그럴 때 마구잡이 식으로 div태그를 필요할 때마다 만들거나 혹은 div태그를 복붙 복붙 해서 사용하곤 한다 그럴 때 유용하게 사용할 수 있는 것이 바로 Emmet이다. HTML div.wrap>div 이렇게 입력하고 엔터 혹은 탭키를 눌러보면 우리가 흔히 아는 div에 class="wrap"가 지정된 레이아웃을 만들 수 있다 여기서 > 표시는 바로 밑 자식 요소라는 뜻 HTML div.wrap>div.content*3 이런 것도 가능하다 대충 무슨 뜻일까? 그렇다 wrap이라는 클래스의 자식 요소들 content를 3개 추가해주었다 그냥 필요할 때마다 div를 만들어서 사용할 수 있지 않은가? 아.. 더보기 [HTML] image(이미지)에 link(링크) 넣기 html에 가장 기본이 되는 링크 태그를 부모자식 태그의 개념으로 이미지에 넣을 수 있다 코드 구글사이트로 넘어가지는 것을 확인 할 수 있다 끝 더보기 이전 1 다음