본문 바로가기
728x90

전체 글208

colgroup col 태그 colgroup 태그는 테이블 전체 속성을 지정할 때 사용하는 태그. 태그는 태이블의 열에 속성을 한번에 지정할 때 사용하는 태그. 안에 어디라도 기술할 수 있으며, 기술된 하위에만 적용된다. span=n : 적용할 컬럼수를 지정한다. 소스를 통해 기능을 익혀보자. No Code Name EA 1 CODE 1 Computer 3,000 2 CODE 2 LCD 5,000 3 CODE 3 Keyboard 20,000 [결과] 2021. 8. 2.
태그별 - position 태그들을 위치를 지정할 수 있는 속성 style="position:속성값" 속성값 종류 absolute relative static fixed 1. absolute 자신을 포함한 영역의 좌측 상단을 기준으로 지정된 위치에 고정 시킬 때 사용합니다. [실행코드] position:absolute outer 1 inner 1 outer 2 inner 2 [실행결과] outer2 의 위치중 top:300px로 이동한 결과 입니다. inner2의 위치가 outer2의 위치가 어디에 있던 상관없이 outer2의 좌측 상단을 (0,0)으로 계산하여 inner2가 배치되는 것을 알 수 있습니다. 2. relative 원래 있어야 할 위치로 부터 left/top 크기 만큼 이동 됩니다. 원래 있어야 위치의 공백으로 남아.. 2021. 8. 1.
외부 스타일 파일 참조 CSS와 HTML의 연결 .css 파일 불러들이기 Linking to an External Style Sheet .css 파일은 HTML의 'LINK'를 이용해서 HTML 문서와 연결할 수 있다. 는 HTML 문서의 안에 두어야 한다. 'TYPE' 은 MIME 형식(CSS의 경우 text/css)을 지정하는데, Css를 지원하지 않는 브라우저에서는 이것을 무시할 수 있도록 해준다. 'MEDIA'는 Css가 적용될 매체를 지정하는데, 그 형식은 다음과 같다. print 인쇄 screen 화면 출력 projection 프로젝터 출력 braille 점자출력 aural 음성 출력 all 모든 매체에 대한 출력 여러 매체를 지정할 때에는 쉼표를 사용하거나 'all'을 사용한다. 보기 REL은 HTML문서와 연결된.. 2021. 8. 1.
리스트 스타일 지정 리스트 속성 List Style Image 형식 list-style-image: display의 'list-item'에 연결된 요소에 지정할 수 있으며, 목록 기호로 사용될 그림을 설정하며 list-style-type에서 지정된 기호를 대신한다. [예] 백두산 한라산 태백산 지리산 내장산 치악산 List Style Position 형식 list-style-position: display의 list-item을 가지는 요소Element에 대해 목록 기호의 위치를 정한다. [예] nomal 백두산 : 양강도(량강도) 삼지연군과 중국 지린성의 경계에 있는 산. 높이 2,744m로 북위 41˚01´, 동경 128˚05´에 있으며 한국에서 제일 높은 산이다. 백색의 부석(浮石)이 얹혀 있으므로 마치 흰 머리와 같다.. 2021. 8. 1.
테두리와 스타일 2021. 8. 1.
바탕이미지 스타일 DHTML(CSS) 바탕이미지 브라우저 바탕의 이미지를 어떤 형태로 지정할 것인가를 결정한다. 1. background-image 바탕에 표시할 이미지를 지정한다. background-image:url(파일명) * ()안의 파일명은 따옴표 없이 명기한다. [기본예] 문단 태그 안에 이미지 넣기 그림 1) 문단 태그 안의 이미지 2. background-attachment 브라우저 내용이 스크롤 될 때 표시된 이미지를 같이 스크롤 할 것인지 고정시킬 것인지 지정한다. background-attachment:fixed | scroll [기본예] 바탕에 이미지를 붙이고 스크롤 속성을 바꾸어 비교해 보자. 그림 2) background-attachment:scroll 그림 3) background-attachm.. 2021. 8. 1.
문단모양과 스타일 문단 모양 1. 들여쓰기(text-indent) 첫 번째 줄의 들여쓰기 정보를 조절해주는 명령이다. 줄간격의 단위는 “in, cm, mm, pt, em"을 줄 수 있다. 일반적으로 쓰이는 단위는 글자단위로 처리하는 ”em"를 사용한다. 기본단위는 pt(pixel) text-indent:3em ▶ 3글자 들여쓰기 text-indent:3cm ▶ 3cm 들여쓰기 text-indent:3in ▶ 3inch 들여쓰기 text-indent:3mm ▶ 3mm 들여쓰기 text-indent:3pt ▶ 3pixel 들여쓰기 2. 줄간격 조절하기(line-height) 숫자나 퍼센트를 입력하면 현재 본문내 글꼴 크기에 숫자를 곱한만큼 행간이 늘어난다. 실수사용도 가능하다. line-height:3 ▶ 글꼴 크기의 3배만.. 2021. 8. 1.
글꼴 스타일 글꼴 글꼴 지정 스타일 font-family 글꼴을 지정할 수 있다. font-style 글꼴의 속성을 지정할 수 있다. font-variant 글꼴을 약간 큰 대문자로 표현한다. font-weight 글꼴의 굵기를 지정할 수 있다.(모든 브라우저 미지원) font-size 글꼴의 크기를 지정한다. font 글꼴에 해당 하는 속성을 한번에 지정할 수 있다. 1. font-family - 글꼴을 지정할 수 있는 속성 - 사용자 시스템에 지정된 글꼴이 없을 때를 대비하여 콤머로 구분하여 대치 글꼴을 지정해야 된다. - 글꼴 이름에 빈공백이 있는 경우에는 "" 나 '' 로 묶어 주어야 한다. 예1] 태그에 직접 글꼴 지정 휴먼편지체 예2] 대치 글꼴 지정 고딕체 2. font-style - value : no.. 2021. 8. 1.
728x90
LIST