웹 유용할 태그들 정리
1. alert창 띄우기 (html)
<script>alert(\"텍스트 입력\");</script>
2. 다른페이지로 이동 (php)
<?
header("location:이동할 페이지");
?>
3.다른 페이지로 이동 (html)
<meta http-equiv="refresh" content='지연시간; url=이동할페이지'>
따옴표 위치에 주의하자.
4. 다른 페이지로 이동 (java)
자바스크립트를 사용하기에 <script language='javascript'></script>를 입력해줘야한다.
<script language='javascript'>
location.href="이동할 페이지";
</script>
4-1 다른 프레임에서 다른 페이지로 이동
<script language='javascript'>
parent.프레임이름.location.href="이동할 페이지";
</script>
<script language='javascript'>
window.open(페이지 주소);
</script>
<script language='javascript'>
parent.location.reload();
</script>
<style type="text/css"> <!-- |
A: hover {text-decoration:underline; color:#529CFF} | ![]() | |
![]() | ![]() | ![]() |
![]() | ![]() | ![]() |
![]() | A: hover {text-decoration:underline overline; color:#529CFF} | ![]() |
![]() | ![]() | ![]() |
![]() | ![]() | ![]() |
![]() | A: hover {text-decoration:none; color:#000080; background:#D0E0FF; padding:2 2 0} 여기에 마우스커서가 올라가면 링크주변이 배경색으로 채워집니다 A:link, A:visited, A:active 로 시작되는 줄에도 각각 padding 2 2 0 를 추가해주시면 보기 좋습니다. 배경이나 글자가 잘리거나 움직이지 않게 하기 위해 넣은 부분입니다. | ![]() |
![]() | ![]() | ![]() |
![]() | ![]() | ![]() |
![]() | A: hover {text-decoration:none; color:#529CFF; font-weight:bold} | ![]() |
![]() | ![]() | ![]() |
![]() | ![]() | ![]() |
![]() | A: hover {text-decoration:none; color:#529CFF; font-size:11pt} | ![]() |
![]() | ![]() | ![]() |
![]() | ![]() | ![]() |
![]() | A: hover {text-decoration:none; color:#529CFF; background:url(dotline.gif) repeat-x bottom} 여기에 마우스커서가 올라가면 점선 이미지가 밑줄로 보여집니다 dotline.gif 는 점선밑줄로 사용할 그림의 경로 및 이름. | ![]() |
![]() | ![]() | ![]() |
![]() | ![]() | ![]() |
![]() | A: hover {text-decoration:none; color:#529CFF; border-bottom:1 dotted #0000FF} 여기에 마우스커서가 올라가면 #0000FF색의 점선 밑줄이 생깁니다 이 경우, 밑줄로 쓰일 이미지는 따로 필요하지 않지만, 익스플로러 5.5 이상에서만 보입니다. | ![]() |
![]() | ![]() | ![]() |
![]() | ![]() | ![]() |
![]() | A: hover {text-decoration:none; color:#000080; border:1 dotted #0000FF; padding:2 3 0} 여기에 마우스커서가 올라가면 링크주변에 #0000FF색 점선박스가 생깁니다 A:link, A:visited, A:active 로 시작되는 줄에는 각각 padding 2 3 0 을 추가해주시면 보기 좋습니다. 글자가 움직이지 않게 넣어준 여백입니다. 점선박스로 사용할 이미지는 따로 필요하지 않지만, 익스플로러 5.5 이상에서만 보입니다. | ![]() |
![]() | ![]() | ![]() |
![]() | ![]() | ![]() |
![]() | A: hover {text-decoration:none; color:#529CFF; border-bottom:3 solid #0000FF} 여기에 마우스커서가 올라가면 두께 3, #0000FF색의 굵은 밑줄이 생깁니다 밑줄로 쓰일 이미지는 따로 필요하지 않지만, 익스플로러 5.5 이상에서만 보입니다. | ![]() |
![]() | ![]() |
5. javascript 팝업
window,open("URL",이름,속성); -> 팝업창 호출
window.opener.document.폼네임.필드네임.value=값 -> 팝업 호출 이전창으로 값 보내주기
ex) 이전창에서 form name=form 이고 input type=text name=id 라면
팝업으로 열린창에서window. opener.document.form.id.value="hello" 할때 원래 창에서의 id 에 hello가 들어간다.
현재 창의 내용을 사용할떄 window.document를 사용하듯 이전창의 내용을 사용하려면 window.openr.document를 이용한다. 반대로 새로운 창을 열면서 값을 보내주려면 window.open()안에 값을 넣어준다.
6. javascript ID 이용하기
document.getElementById(ID).value=값;
태그를 이용하면 html 안에서 id="" 로 지정해준 값들을 받아와 자바스크립트에서 사용이 가능하게 한다. 여러모로 유용한 함수.