본문 바로가기

HTML

(5)
[CSS] Pseudo-Class Selectors Level 4 - :is, :where 출처 : https://web.dev/css-is-and-where/ New CSS functional pseudo-class selectors :is() and :where() These seemingly small additions to CSS selector syntax are going to have a big impact. web.dev :is() /* before */ h1 > b, h2 > b, h3 > b, h4 > b, h5 > b, h6 > b { color: hotpink; } /* after */ :is(h1,h2,h3,h4,h5,h6) > b { color: hotpink; } :where() :is 와 기능적으로는 같은 함수, 단 우선 순위가 :is 가 높고, :where 는 우..
301, 302 리디렉션(redirects, 리다이렉션) 사이트를 리뉴얼 하거나 대표 페이지를 변경 하고자 할때 리디렉션이 필요 하다. 302 Found 를 사용해서 리디렉션을 시킬경우 검색 엔진에서는 일시적으로 이전했다고 보고 제대로 반영 되지 않을 수 있다. 구글이나 네이버에서는 301 Moved Permanently 리디렉션을 권장 하고 있다. 그래서 아래와 같이 리디렉션 시켜 주어야 한다. 301 Moved Permanently ( HTTP 응답 상태 코드 ) 페이지가 새 위치로 영구 이전 했다는 의미. 사이트 이전시 검색엔진 최적화를 위해서는 301 리디렉션을 이용 해야 한다. 이와 함께 Canonical 태그를 같이 사용 해주면 좋다. 대표주소? 표준주소? 정도로 알려주는 태그 이다. 302 Found ( HTTP 응답 상태 코드 ) 페이지가 일시적..
[ HTML ] 테두리 만드는 거 Insert Image / Upload Image 내용 넣기
[ CSS3 ] CSS 기초 CSS ( Cascade Style Sheet ) 의 약자로서 W3C의 CSS 규격으로 표준화 되어 있습니다. 요즘 웹 문서들은 대부분 태그를 사용하는 것 보다 태그와 CSS를 이용하는 쪽으로 변화하고 있습니다. 1) CSS를 배워야 하는 이유? (1) 통일감 있는 문서 작성이 가능 -> 한 번만 정의하면 웹 문서에 일관되게 적용할 수 있습니다. (2) 문서 관리의 편리 -> 스타일 시트 파일을 만들어놓으면 어떤 문서든 편하게 적용 가능합니다. (3) 웹 문서의 편집이 자유로움 -> 기존 태그를 이용한 편집보다 많은 자유도를 제공합니다. 2) CSS 적용 사례 예제 ( PhoneGap의 튜토리얼 Index.html ) > 위의 두 그림에서 가장 큰 차이는 CSS파일을 지정했다는 것..
[ HTML ] 메타태그 관련 메타태그는 사이에 들어가며, 웹페이지에 관한 정보를 제공합니다. :웹문서의 언어를 설정 (euc-kr) :웹문서의 언어를 설정 (utf-8) :그림위에 마우스 오버시 이미지 관련 툴바가 생기지 않음 :0초후 해당 페이지이동 :60초마다 새로고침 : 캐쉬에서 해당페이지 읽어들이는 걸 방지 : 기술된 언어 ◇ 메타태그의 검색로봇 관련 : 로봇 검색을 허가함 : 로봇 검색을 허가하지 않음 : 이 문서도 긁어가고 링크된 문서도 긁어감. : 이 문서는 긁어가지 말고 링크된 문서만 긁어감. : 이 문서는 긁어가되, 링크는 무시함. : 이 문서도 긁지 않고, 링크도 무시함.