3-5-04.html
퍼블리쉬 검증 사이트
영문
http://validator.w3.org/check/
국문
css검사기
http://jigsaw.w3.org/css-validator/
CSS 인덱스
http://msdn.microsoft.com/en-us/library/ms531207.aspx
※유효성 통과인증배너
<p>
<a href="http://validator.w3.org/check?uri=referer"
target="_blank">
<i★mg s★rc="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0
Transitional" height="31" width="88" /></a>
</p>
로딩타임보기_페이지로드 지연시간측정 페이지
-----------------------------------------------------
css의 종류
외부 스타일시트(external style sheet)
방법1
<link rel="stylesheet" type="text/css" href="주소" />
방법2
<style type="text/css">@i-port url("주소");</style>
내부 스타일시트(internal style sheet)
페이지 상단에서 선언
인라인 스타일시트(inline style sheet)
같은 태그안에서 선언
-----------------------------------------------------
padding:5px; //안쪽공간 띄움
margin:5px; //바깥공간 띄움
#wrapper {margin:0 auto; width:1000px;} //센터정렬
div는 입력하지 않으면 100%로 인식한다.
div에서 height=100% 는 적용되지 않는다.
-----------------------------------------------------
border 표현형식(첨부파일참조)
border-top
border-top-style: none; hidden; dooted; dashed; solid;
double; groove; ridge; inset; outset;
border-top-width:
border-top-color:
border-collapse: separate; collapse; inherit;
폰트(font)
font로 종합명령을 내릴때는 순서를 지켜야하며
size와 family는 필수속성이다.
형식
font: (weight style variant ) size /line-height font-family ;
font-weight
normal 은 font-weight : 400 과 동일하게 렌더링되며
bold 의 경우는 font-weight : 700 과 같은 굵기
line-height
--------------------------------------
반행간 (half-leading)
--------------------------------
폰트사이즈
--------------------------------
반행간 (half-leading)
--------------------------------------
font-variant 와 text-transform
font-variant
크기가 작은 대문자로 변형됨
text-transform
text-transform: uppercase; 대문자
text-transform: lowercase; 소문자
text-transform: capitalize; 첫글자 대문자
white-space (공백 문자 처리 / 줄바꿈 처리)
white-space:pre;
분문을 그대로 붙여넣고 <br / >처리가 번거로울경우 유용하게 쓸수 있을것같다.
white-space:nowrap;
텍스트가 줄바꿈이 안되고 스크롤로 연결되거나 div뚫어버리고 싶을때
※nowrap="nowrap" 라는것이 있는데 같은기능이지만 table에서만 적용된다.
background(백그라운드) 속성 한번에 표현하기
형식은 다음과 같습니다.
background: color url(주소) repeat position attachment inherit
↑ 포지션 x좌표,y좌표
ex)최 우측 하단에 이미지 심기
background:url(주소) 100% 100% no-repeat;
background:url(주소) no-repeat right top;