반응형

전체 글 298

DOM과 Javascript를 사용한 간단한 Show, Hide

DOM이란 Document Object Model 의 약자로서 "문서객체모델" 이다. CSS가 웹페이지의 스타일 변경을 한다고 하면, DOM은 웹페이지를 동적으로 움직일수 있게 도와준다고 생각하면 된다. 그러나 DOM만 있다고 해서 웹페이를 동적으로 만들수 있는것은 아니고, Javascript등의 제어를 통해서 동적으로 만들수 있다. getElementById() 메소드는 특정 아이디를 가진 요소 노드에 직접 접근할수 있다. 대소문자를 구분하므로 반드시 getElementById 로 적어야 한다. 메인메뉴 서브메뉴1 | 서브메뉴2 | 서브메뉴3 | 서브메뉴4 | 서브메뉴5 여기부터는 내용입니다. 2개의 DIV 태그에 각각 아이디를 부여하고 그 아이디를 getElementById 메소드로 접근해서 해당 스..

Web/Dom 2007.12.10

좌사우사중언하심.. ( 左糸右糸中言下心 )

영화 ただ、君を愛してる (다만, 널 사랑해-주연: 타마키 히로시, 미야자키 아오이) 의 영화를 보면 마지막 부분에 이런말이 나온다. 生涯だだ一度のキス、だだ一度の恋 생애 단지 한번의 키스, 단지 한번의 사랑 여기서 恋 라는 글자를 보면 이것은 약자이다. 원래는 戀 이다. 일본에서는 당연히 쓰지를 않는 한자이지만. 일본의 경우에는 恋人(こいびと、코이비토) 즉, 연인이다. 일반적으로는 한국에서는 애인으로 통하는 글자이다. 또 하나는 愛人(あいじん、아이진) 말그대로 애인이다. 두단어의 뜻이 한국에서는 같은 의미로 통하지만 일본의 경우에는 전혀 다르다. 한국에서 말하는 애인의 경우에는 愛人 이 아닌 恋人 이다. 일본사람들이 애인이 있냐고 물을 경우에는 君、恋人いる?(너 애인있니?) 형식으로 묻는다. 그러면 愛人 ..

Hobby 2007.12.06

앵커(anchor) 스타일 적용하기

스타일 시트로 앵커 적용하기 앵커의 속성에는 4가지가 있다. link, visited, hover, active 이다. 사용방법은 스타일 태그 내에 a:link { color:red; } 링크 a:visited { color:purple; } 한번 방문한 링크 a:hover { color:green; } 마우스가 링크위에 올라갔을때 a:active { color:yellow; } 마우스를 눌렀을때 형식으로 사용하면 된다. 여기서 주의 할것은 반드시 위의 순으로 코딩이 되어야 한다는 것이다. 만약 순서가 바뀔경우에는 적용이 되지 않는 경우가 있으므로 반드시 link, visited, hover, active 순으로 코딩해야 한다. 쿠프 네이버 위의 쿠프는 빨강색으로 표시가 된다. text-decoratio..

Web/Css 2007.12.01

絢香 - Jewelry day

絢香(あやか) 아야카 1987년 12월 18일 오사카 출생 2006년 I believe, 三日月 로 가수활동 시작. Jewelry day broken broken my heart 今もまた目覚め 夢だと気付く 朝 恋しそうに 見つめる笑顔が 今も消えない Oh jewelry day 君といたあの歌が まだ聴けない Oh 心静かに手をつなぎ 沈みゆく夕日を見つめれば 言葉なんて一つも いらなかった 幸せの意味 知ったの… 遠い街まで出かけたBirthday 特別なデートで 握りしめた手の中に光る おそろいのペアリング Oh Jewelry day 終わらない物語 ウソのように… Oh いつかは終わる旅の中 愛する喜びをくれたあなたに "ありがとう"叫ぶよ 聞こえてるなら 声を届けて お願い Oh あの日見た夕日包み込む 大きなオレンジが 今も胸を温かくするから 立ち..

Hobby/Music 2007.11.24

건담 더블오 L'Arc~en~Ciel - DAYBEAK'S BELL

건담 더블오 DAYBEAK'S BELL ねぇ こんな形で出逢いしか無かったの? 悲しいね 貴方に死んでも殺めて欲しくも無い …お願い 運命さえ飲み込まれ沈みそうな海へと 願いよ風に乗って夜明けの鐘を鳴らせよ 鳥のように My wishes over their airspace. 無数の波を越え明日へ立ち向かう貴方を 守りたまえ My life I trade in for your pain 争いよとまれ ねぇ 人はどうして繰り返し過ちを重ねてく? 進化しない誰もに流れるこの血が 大嫌い 炎(ほのお)で裁き(さばき)合う誰のでもない大地で 澄みわたる未来が来たなら草花も兵器に 宿る(やどる)だろう My wishes over their airspace. 誰か揺り起こして(ゆりおこして)悪い夢から覚ましてよ 叶うのなら My life I trade in for your ..

Hobby 2007.11.21

요미우리랜드 - 오카노유 (丘の湯) 온천

동경에는 유명한 온천이 오다이바에 있는 오오에도 온천이 유명하다. 유명한 만큼 입장료도 성인을 기준으로 2800엔으로 비싼편이다. 신주쿠에서 오다큐선을 타고 30분정도 가면 요미우리랜드앞역이 있다. 말 그대로 서울랜드 같은 놀이 동산이다. 요미우리랜드와 함께 오카노유 라는 온천도 있다. 입장료는 평일 600엔, 공휴일 700엔이다. 회원이 된다면 조금더 저렴해진다. 일반적인 센토우(한국의 목욕탕)가 300엔에서 500엔 정도 하는것을 생각한다면 그렇게 비싸지는 않는것 같다. 오다이바온천 만큼의 시설은 아니지만 가격을 생각한다면 상당히 괜찮을것 같다. 바로 옆에 요미우리랜드가 있어서 온천과 놀이를 함께 즐길수 있다. 요미우리랜드의 입장료는 성인을 기준으로 1600엔, 자유이용권은 3900엔이다. 요미우리랜..

Travel 2007.11.15

박스 모델

박스 모델 페이지 내에서의 모든 태그들은 사각형의 박스 모델로 표현이 된다. content 부분이 내용이 들어가는 부분이다. content 부분은 보이지 않는 ( 패딩, 보더, 마진 미설정시 ) padding, border, margin 으로 둘러싸여져있다. 안녕하세요 ! 반갑습니다. 오늘은 좋은 날씨입니다. 먼저 이해를 돕기 위해 border를 1px , 빨간색 실선으로 설정. 코드를 실행하면 안녕하세요와 반갑습니다.... 가 빨간색 실선으로 붙어서 표시되는 것을 볼수 있다. 그러면, 여기에 margin을 추가해 보자. 위의 코드에서 p { border-width:1px; border-color:red; border-style:solid; margin:5px; } margin을 추가해서 실행해보면, 안..

Web/Css 2007.11.14

스타일시트를 문서에 적용하는 법

CSS(Cascading Style Sheets)를 문서에 적용하는 방법 1. 방법 1 html 문서내에 직접 입력을 하는 방법. 안녕하세요 ! 2. 방법 2 문서 내의 태그에 직접 입력을 하는 방법. 안녕하세요! 3. 방법 3 링크를 이용하는 방법. -- style.html -- 안녕하세요! -- style.css -- p { color:orange; font-weight:bold; } 4. 방법 4 임포트를 이용하는 방법. -- style.html -- 안녕하세요! -- style.css -- p { color:orange; font-weight:bold; } 결과는 모두 안녕하세요! 가 오랜지색으로 굵게 표시 된다. 거의 모든 브라우저에서 적용이 되지만 import의 경우에는 적용이 안되는 브라우저..

Web/Css 2007.11.14

레이아웃 가운데 정렬하기

CSS를 사용하여 레이아웃을 가운데 정렬하는 방법 1. 방법 1 가운데 정렬할 박스 : 박스의 크기는 가로 800픽셀로 가정 오랜지색으로 표현된 부분은 explorer 버그로 인한 설정. 파이어 폭스의 경우에는 오랜지색 필요없음. 현재 익스플로러 사용자가 더 많은 관계로 반드시 필요함. 2. 방법 2 가운데 정렬할 박스 박스의 크기가 800px인 박스의 시작점을 좌측에서 50%인 지점에서 시작( 그렇다면 시작지점이 브라우저의 정중앙이 된다.) 시작지점에서 박스의 사이즈의 반인 400px 만큼 마이너스로 이동하므로 결국은 가운데 정렬이 된다. 쉽게 플러스는 오른쪽, 마이너스는 왼쪽이라 생각하면 된다. 만약 박스의 가로 사이즈가 700px 이라면 -350px가 되어야 한다. 즉, margin-left: -(..

Web/Css 2007.11.14
반응형