More actions
2012.07.04
- 오늘 했던 거 거의 다 때려 박은 소스임...;;
- 필요하면 수정도 좀- - 권순의
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>title</title> <style> li > span {background-color: gray;} li ul {display: none;} .menu > li:hover > span {background-color: blue; color: white;} /* (elementName)(.elementName)(:pseudo-class) */ li:hover ul {display: block;} div.alert { width: 200px; height: 150px; border:1px solid black; <!--position: absolute;--> <!-- books 위로 올라오게 됨 --> position: fixed; bottom: 0px; background-color: white; <!--float: left;--> } </style> </head> <body> <h1>Books</h1><!-- head는 block(영역을 잡음)의 개념이라 inline(글자처럼 취급)이 되면 아래 이미지가 위로 올라옴--> <ul class="menu"> <!-- unordered list --> <li> <span>File</span> <ul> <li> <span>New</span> </li> </ul> </li> <!-- list item --> <li>b</li> <li> <ol > </ol> </li> </ul> <ol class="menu"> <!-- ordered list --> <li><span>a</span></li> <li>b</li> </ol> <span><!--span 안에 style="color: red;"를 css로 뺄 수 있음-->HaHa</span> <!-- span: inline element --> <span>zz</span> <div>hahaha</div><!-- div: block element --> <div>hahahaha</div> <img src = "http://jsfiddle.net/img/social-icons/facebook_16.png" alt="Facebook" /> <table border="1" style="margin: 10px;" summary="books_const"> <tr><!-- table row --> <th rowspan="2">price</th><!-- table head cell --> <td>5,000 won</td><!-- table data cell --> </tr> <tr> <td>5</td> </tr> <tr> <td colspan="2">25,000 won</td> </tr> </table> aaa<div class="alert">1이 내용이 올라옵니다.</div><div class="alert">2가 내용이 올라옵니다.</div>bbb </body> </html>
2012.07.11
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>20120711</title> </head> <body> <form action="http://zeropage.org/act" method="post" onsubmit="if (this.password.value.length < 1) {alert('required pw'); return false;} else {return true;}"><!-- 데이터들이 서버로 넘어감.. 서버에서 받아 보기 위해서는 이름이 있어야 한다. --><!-- name이 있는 것만 전송됨 --> <!-- action은 form을 전송할 곳 기본은 자기 자신 / 외부로도 할 수 있음. --><!-- method를 post로 하게 되면 넘길 때 캐시가 안 남음. 암호화는 아님 URL에는 안 붙이고 간접적으로.. --> <!-- onsubmit 은 검사용 --> <label for="form_id">ID </label><input id="form_id" size="5" maxlength="5" name="id" type="text" value="abc" /> <!-- 기본 라인 용 --><br/> <label for="form_psw">PSW</label><input id="form_psw" size="5" name="password" type="password" value="abc" /><br/> <input name="group "type="hidden" value="abc" /><br/><!-- 안 보이나 있음.. --> <textarea name="detail">abc def</textarea> <!-- 멀티 라인 용 --><br/> <input name="upload" type="file"/><br/> <input name="chk" type="checkbox" value="abc" id="form_chk"/><label for="form_chk">abc<!-- 이름이 있어야 함 --></label><br/> <input type="checkbox" value="abc" checked="checked"/>abc<!-- 이름이 있어야 함 --><br/> <input type="checkbox" name="chk[]" value="a" checked="checked" /> a<br /><!-- chk[]으로 되어 있으면 배열로 인식 --> <input type="checkbox" name="chk[]" value="b" checked="checked" /> b<br /> <input type="checkbox" name="chk[]" value="c" checked="checked" /> c<br /> <input type="radio" value="abc" />abc<!-- 이름이 있어야 함 --><br/> <input type="radio" value="abc" checked="checked" />abc<!-- 이름이 있어야 함 --><br/> <select name="combo"> <option value="123">a</option><!-- value가 있으면 value 값이 넘어가고 없으면 뒤에 글자가 넘어감 --> <option selected>b</option> </select><br/> <input type="button" value="abc" /><br/> <input type="submit" value="전송" /><br/> <!-- name이 있어도 되나 있어 봤자 딱히.. --> <input type="reset" value="취소" /><br/> </form> </body> </html>