Blue Breeze

div.menu{width:auto;padding:0;margin:5;border:0 solid gray;border-top:0;font-size:12px;text-align:center} div.menu a{display:block;margin:0;width:auto;padding:0.2em;font-weight:bold;border-top:0 solid 000;color:999;text-decoration:none} html>body div.menu a{width:auto} div.menu a:hover{background:tomato;color:#fff;text-decoration:none} bluebreeze.co.kr

font-size:expression(document.body.clientWidth /15)

측정 단위의 종류 상대적인값 절대적인값 상대적인 값에 속하는 것은 px(pixel), em, ex, % 등이 있다. 이들은 화면의 크기에 따라 측정단위의 크기도 변하는 것들이다. 예를 들어, 800x600 해상도에서의 1픽셀 크기와, 1024x768 해상도의 1픽셀 크기는 다릅니다. em이나 ex, 퍼센트 등도 마찬가지이다. 절대적인 값은 우리가 일상적으로 많이 사용하는, 인치(inch)라든지, 센티미터, 밀리미터 등이 여기에 속한다. 그외에, 포인트(pt, points)와 파이카(pc, paicas)도 절대적 단위이다. 1포인트는 1인치를 72로 나눈 값입니다.( 1pt = 1/72inch ) 1파이카는 12포인트입니다.( 1pc = 12pt ) em은 어떤 요소의 일반적인 크기를 의미하는 것으로 만약..

strong i {color:red} 위와 같이 몇 개의 selector를 나열하 듯이 쓰는 경우 뒤에 나온 것은 앞에 나온 selector 내에서만 의미를 갖는다. 위의 스타일 정의는, strong 태그 안에서 나오는 i 태그만 빨간색이 된다. 이미지를 링크로 활용할 때 경계선을 감추는 경우 contextual selector를 이용하면 기존 html 태그처럼 일일이 border=0을 쓸 필요 없다. a img { border:0; }a 태그 내부에서 img 태그가 나오는 경우 border는 0이 된다 xhtml과 관계는? xhtml은 html을 xml의 형태로 확장한 것이다. xml처럼 html 태그가 서맨틱스적인 면, 즉, 태그가 감싸고 있는 내용이 어떤 내용인지를 설명하는 식으로 사용하게 하려는 ..

슈도클래스를 이용하면 html에 기본으로 들어 있지는 않지만 웹브라우져에서는 지원이 되는 부가적인 속성을 만들어 낼 수도 있다. 예를 들어, 태그는 link, active, visited 속성이 없다. 하지만 실제 웹브라우져는 링크의 상태에 따라 다른 색깔을 보여주고 있다. 그래서 다음과 같이 슈도 클래스를 정의할 수 있다. 콜론( : )을 사용 a:link{color: blue} a:visited{color:red} a:active{color: white} 이렇게 하면, 방문하지 않은 링크는 파란색, 방문한 링크는 빨간색, 링크를 클릭하면 하얀색으로 바뀝니다. 자주 쓰는 활용을 하나 예로 들어 보면, 링크에 밑줄이 없는데 마우스 포인터를 위로 가져가면 색깔이 바뀌면서 밑줄이 생기는 것이 많이 쓰이는데,..

.css 파일은 html의 'link'를 이용해서 html 문서와 연결할 수 있다. 는 html 문서의 안에 두어야 한다. 'type' 은 mime 형식(css의 경우 text/css)을 지정하는데, css를 지원하지 않는 브라우저에서는 이것을 무시할 수 있도록 해준다. 'media'는 css가 적용될 매체를 지정할수있다. print 인쇄 screen 화면 출력 projection 프로젝터 출력 braille 점자출력 aural 음성 출력 all 모든 매체에 대한 출력 여러 매체를 지정할 때에는 쉼표를 사용하거나 'all'을 사용한다. rel은 html문서와 연결된 파일 사이의 관계를 정의한다. 위의 보기는 현재문서가 'sam.css'파일에 의해 모든 style sheet가 설정되어 있음을 보여준다. 위..