Re:css, 자바스크립트 함수 작성~

...에휴.... 오늘은 이 기나긴 답변 하나로 시간 다 때우네... ㅜㅜ 간략하게 기술한 것이므로 충분하지는 못할것이므로 다른분들이나 웹 사이트를 통해 보강해 보세요... 첨부파일로 따로 등록했으니 다운받아 읽어 보는게 나을겁니다.. 2.css용어중 ''선택자''에 대해서 설명하시오. 1. 공통 선택자 (Universal Selector) 전체 선택자(All Selection)이라고도 하며 HTML문서내의 모든 태그(Element)에 지정한 CSS를 적용시키는 것으로 구문형식은 * {속성 문자열} 예) * {font-size: 9pt;} 라고 정의할 때 HTML문서내 모든 태그의 글자크기는 9pt. 2. 타입 선택자(Type Selection) 태그를 작성하고 CSS를 정의. 구문형식은 태그{속성 문자열} 예) P { font-size: 9pt; } 라고 정의할 때 P가 타입 선택자. 3. 클래스 선택자(Class Selection) class 란 속성으로 지정 스타일을 적용시킬 수 있으며, ID 와는 달리 아무 태그에서나 사용할 수 있다. 구문형식은 ".이름{속성 문자열}" 예) .test {font-size:9pt; color:blue;} ▶ 테스트 4. ID 선택자(Identity Selection) 하나의 특정 태그에서만 사용할 수 있으며. 구문형식은 "#이름{속성 문자열}" 예) #test {font-size: 9pt;} ▶ 테스트 5. 복수 선택자 여러개의 선택자에 같은 style을 지정. 묶어서 일괄 지정하므로 CSS구문을 줄여줄 수 있다. 구문형식은 태그,태그,태그, ... {속성 문자열} 또는 태그,태그,태그.이름{속성 문자열} 예) p,table,div {font-size:9pt;} 라고 정의했을 때 p,table,div 태그내 글자크기는 모두 9pt. 6. 객체상속선택자. 특정태그나 Class , ID에 스타일을 적용시키는 선택자로 구문형식은 #ID 태그{속성 문자열} , .class{속성 문자열} , .class .class{속성 문자열}... 씩... 예) .class p {font-size:9pt;} , #ID div {font-size:9pt; color:red;} 7) 중요구문 선택자(Important Selection) 스타일문의 우선순위를 무시하고 최우선적으로 적용시키고자 하는 선택자. 구문형식은 태그{속성 문자열 !important} 예) P.test { font-size:9pt !important } 이와같으 CSS를 주었고 P 태그를 라고 정의했을 때 P 태그안의 스타일은 무시되고 class로 호출한 9pt 크기의 텍스트가 적용된다. 8) 도입 선택자(Import Selection) 링크 선택자라고도 하며, 스타일 명령을 다른 스타일 시트로부터 도입(import)해서 적용할 수 있다. 구문형식은 @import‎ url("css파일명 또는 링크"); 예) @import‎ url("test.css"); 이와 같이 정의했을 때 test.css란 스타일시트를 불러와 적용시킨다. ===================================================================== 3.css사용법중 외부 스타일시트를 불러오는 형식과 태그에 직접 삽입하는 형식을 쓰시오. A. HTML 태그요소에 직접삽입 : <ELEMENT style="속성 문자열;"> ex) B. 외부문서의 참조 : <LINK rel="stylesheet" type="text/css" href="문서이름.css"> ===================================================================== 4.css를 이용하여 table내부의 font와 문장모양을 다음과 같이 하려한다. 알맞은 형식을 쓰시오. 글꼴:굴림체 글꼴크기:9pt 글꼴기울임:이텔릭체 글꼴두께:두껍게 문장정렬방식:가운데 글꼴에 선긋기:밑에선긋기 1. table element에 직접 정의. <table border=0 cellpadding="0" cellspacing="0" style="font-size:9pt; font-weight:bold; font-style: italic; font-family:굴림체; text-align:center; text-decoration: underline;"> <tr> <td width="400" height="300"> 이 글자는 9pt 크기의 굵고 기울어진 굴림체로 가운데로 정열된 밑줄이 그어진 글자임. </td> </tr></table> 2. 스타일문으로 따로 정의시 <style type="text/css"> table.test { font-size:9pt; font-weight:bold; font-style: italic; font-family:굴림체; text-align:center; text-decoration: underline; } </style> <table border=0 cellpadding="0" cellspacing="0" class="test"> <tr> <td width="400" height="300"> 이 글자는 9pt 크기의 굵고 기울어진 굴림체로 가운데로 정열된 밑줄이 그어진 글자임. </td> </tr></table> ===================================================================== 5.커서모양을 ''?''모양으로 바꾸는 스타일 형식과 손모양으로 바꾸는 스타일 형식을쓰시오. 1. A(하이퍼링크) 태그에 바로 정의. <a href="URL" style="cursor:help;"> ? 커서 </a> <a href="URL" style="cursor:hand;"> 핸드커서 </a> 2. 스타일문에 정의하고 호출하는 방식. <style type="text/css"> a.hover.test1 { cursor:help; } a.hover.test2 { cursor:hand; } </style> <a href="URL" class="test1"> 마우스 오버시 ? 커서 </a> <a href="URL" class="test2"> 마우스 오버시 손 커서 </a> ===================================================================== 6.a.jpg라는 이미지를 반투명하게 보일수 있도록 태그를 작성하시오. 1. 기본형식(IE5.0 ~ 지원) : filter:alpha(Opacity:투명도) <image src=a.jpg style="filter:alpha(Opacity:10,style:1,finishOpacity:30)"> 알파 필터의 투명도 30%가 적용된 이미지. 2. IE5.5~ 지원(권고) <image src=a.jpg style="filter:progid:DXImageTransform.Microsoft.alpha(opacity=30)"> 알파 필터의 투명도가 40% 적용된 이미지 ===================================================================== 7. 자바스크립트와 자바언어의 특징중 해석위치의 차이점과 언어형의 차이점을 쓰시오 A. 해석위치 측면에서의 차이 -- 자바스크립트 : 클라이언트(사용자측))의 브라우저에서 해석되고 실행돠므로 빠름. -- 자바 : 클라이언트에서 실행되기 전 서버에서 컴파일 작업시 해석. B. 언어형 측면에서의 차이 -- 자바스크립트 : 인터프리터(interpreter) 방식(원시코드 명령문들을 한번에 한 줄씩 읽어들여서 실행하는 프로그램 방식) 원시프로그램 자체를 직접 실행하며 반복되때마다 처음부터 다시 해석하므로 시간이 소요됨. -- 자바 : 컴파일된 실행 파일로 만들어짐으로 보안성을 갖음. 컴파일 과정이 복잡하고 시간이 많이 걸리지만 한번 컴파일되면 반복적으로 사용할 수 있으므로 처리 시간이 빠름. ===================================================================== 9.자바스크립트를 사용하는 두가지 방법을 설명하고 그에 따른 기본구조를 모두 쓰시오. 1. <head> 또는 <body> 부분에 스크립트 를 넣어주는 방법 <SCRIPT LANGUAGE="JavaScript"> 스크립트 코딩..... </SCRIPT> 2. 스크립트 코드를 독립파일(js파일) 형태로 분리해 스크립트에서 불러오는 방법. <SCRIPT LANGUAGE="JavaScript" SRC="js파일의 URL"> </SCRIPT> HTML 태그의 이벤트에 응답하는 부분을 삽입하는 방법 <INPUT type="SUBMIT" name="button1" value="버튼" [안내]태그제한으로등록되지않습니다-onClick="alert(‎"클릭")"> ===================================================================== 13.a.html을 가로 800px, 세로600px의 크기에 스크롤바,상태표시줄,툴바.주소입력줄 메뉴바를 표시하지않는 newwin이라는 새로운 창에 띄우는 스크립트를 작성하시오 <html> <head> <script language="javascript"> function testpop() { /*window.open*/("페이지링크","newwin","width=800px, height=600px, toolbar=no,location=no,status=no, scrollbars=no"); } </script> </head> <body> <a href="javascript://" [안내]태그제한으로등록되지않습니다-onclick="testpop()"> 새창열자 </a> </body> </html> ===================================================================== 15.1부터 100까지 더하고 결과 값을 확인 버튼이 있는 메시지 창에 나타내는 자바스크립트 함수를 작성하시오. <html> <head> <title>1 에서 100까지의 합계</title> <script language="javascript">  </script> </head> <BODY> </BODY> </HTML> ===================================================================== 16.자바스크립트에서 이벤트에 대해서 설명하시오. 이벤트란 특정사건이 발생할 때 생성되는 시그널(Signal)을 의미하며 발생한 시그널을 읽어 추가작업을 할 수 있는 스크립트를 작성할 수 있는 기반을 제공해 주므로 유용하게 쓰이게 됩니다. 마우스 클릭이나 오버시, 페이지 로딩이나 아웃시 발생되는 추가적인 스크립트 기능이 예.... 이벤트의 종류로는 blur ,click , change , focus , mouseover, select, submit , unload 가 있으며 이벤트가 발생했을 때 스크립트의 함수를 자동으로 실행시켜 추가작업을 할 수 있도록 해 주는 자바스크립트 코드를 이벤트 핸들러라고 함.(예 : [안내]태그제한으로등록되지않습니다-onclick , [안내]태그제한으로등록되지않습니다-onmouseover, [안내]태그제한으로등록되지않습니다-onmouseout, [안내]태그제한으로등록되지않습니다-onblur‎, [안내]태그제한으로등록되지않습니다-onchange 등....) ===================================================================== 17.2007년 크리스마스가 며칠 남았는지 알려주는 자바스크립트 함수를 작성하시오. <html> <head> <script language="JavaScript"> var today = new Date(); // 현재 날짜가져오기 var dday = new Date("December 25, 2007"); // 타깃싯점(월 일자,년도) var days = Math.ceil((dday - today) / 1000 / 24 / 60 / 60); // 타깃일자에서 현재날짜를 뺀 일자 </script> </head> <body> <script language="JavaScript"> document.write("2007년도 크리스마스까지는 " + days + " 일 남았습니다.") </script> </body> </html> =====================================================================