본문 바로가기

www/CSS_tip51

after 가상 선택자 개요:hover, :active 외에도 다양한 추상 클래스 / 가상 선택자가 존재하는데 그 중 :after 라는 가상 선택자가 존재한다.이는 컨테이너 요소 안 맨 마지막에 추가시킬 태그를 지정할 수 있다.Internet Explorer 7 이하 버전은 after 가상 선택자를 지원 하지 않는다.사용법#container:after{ content:"추가된 텍스트"; display:block } 예제 #container:after{ content:"더 텍스트가 추가되었습니다."; display:block } 기존 텍스트에 출력 결과:기존 텍스트에더 텍스트가 추가되었습니다 2015. 1. 5.
[CSS] :before,:after 활용하기 - 구분선 예제1111 222 333미리보기1111 222 333 여기에 :before를 이용해서, 혹은 :after를 이용해서 구분자를 만들어봅니다. 처음에는 :after를 사용하곘습니다. 예제 1 - after사용 (CSS)a:after{content:" | "} 미리보기1111222333예제 2 - 마지막의 구분자 없애기a:after{content:" | "} a:last-child:after{content:"";} 미리보기1111222333 2015. 1. 4.
유니버설 디자인을 위한 실전 UI(HTML/CSS)개발 가이드 유니버설 디자인을 위한 실전 UI(HTML/CSS)개발 가이드목차문서형(DTD)을 꼭 선언해야 하나요?문서형(DTD)의 종류가 많던데 권장하는 것은 무엇입니까?XHTML의 문법은 HTML과 비교해서 무엇이 다른가요?HTML과 XHTML 가운데 어떤 문서형(DTD)을 사용하는 것이 좋을까요?문자셋(charset)으로 UTF-8을 권장하는 이유는 무엇인가요?휴먼 랭귀지(human language)가 무엇인가요?문서의 제목 ...을 어떻게 작성하는것이 가장 좋을까요?의미론적 마크업(semantic markup)이란 무엇입니까?제목 요소 ...는 어떻게 작성하는 것이 가장 좋을까요?의미론적 마크업을 잘 하는 방법이 있을까요?논리적인 순서란 어떤 것입니까?논리적 마크업을 위해서 화면 배치를 위한 ...을 사용하지.. 2015. 1. 4.
네이밍 규칙 네이밍 규칙공통 규칙공통 네이밍 규칙 예잘못된 예올바른 예설명Tit_pop.html *-hidden-obj 03_btn_more.giftit-section시작이름은 영문 대문자, 숫자, 특수문자로 시작할 수 없다.(파일 및 폴더 제외)cancle_btn_off_01.gif, msgbox-off-togglebtn_cancle_01_off.gif, msgbox-toggle-off네이밍의 조합은 '형태_의미_순서_상태'을 기본 순서로 사용한다.customerServicecustomer_service네이밍 규칙의 언더스코어(_) 조합은 파일, 폴더, 이미지에 사용한다.hidden_objhidden-obj네이밍 규칙의 하이픈(-) 조합은CSS 네이밍에 사용하는 것을 권장한다. HTML 문서 안에서 언더스코어(_).. 2015. 1. 4.

티스토리툴바