๋กœ๋”ฉ ์ค‘์ž…๋‹ˆ๋‹ค.
๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ

HTML&CSS

<button> ๋ฒ„ํŠผ์— ๋งํฌํ•˜๊ธฐ

๋ฌธ์„œ๋‚˜ ์ด๋ฏธ์ง€์— ๋งํฌํ•˜๋ ค๋ฉด <a href="#">๋ฅผ ํ•˜๋ฉด ๋ฉ๋‹ˆ๋‹ค. <button> ๋ฒ„ํŠผ์— ๋งํฌํ•˜๋Š” ๋ฐฉ๋ฒ•์€ ์กฐ๊ธˆ ๋‹ค๋ฆ…๋‹ˆ๋‹ค.

 

button ๋งํฌ

 

 

button ๋ฒ„ํŠผ์— ๋งํฌํ•˜๊ธฐ

1. ํ˜„์žฌ ํŽ˜์ด์ง€์—์„œ ๋งํฌ ์ „ํ™˜ํ•  ๋•Œ(button onclick ๋งํฌ)

๋ฒ„ํŠผ ํƒœ๊ทธ ์•ˆ์—  onclick="location.heft='#'" ์ด๊ฒƒ์„ ์ถ”๊ฐ€ํ•ด ์ฃผ๋ฉด ๋ฉ๋‹ˆ๋‹ค.

<button type="button" onclick="location.href='mypage.php'">๋งˆ์ดํŽ˜์ด์ง€ ๋ฐ”๋กœ๊ฐ€๊ธฐ</button>

 

2. ์ƒˆ์ฐฝ์œผ๋กœ ๋งํฌํ•  ๋•Œ(button ๋งํฌ ์ƒˆ์ฐฝ)

๋ฒ„ํŠผ ํƒœ๊ทธ ์•ˆ์— onclick="window.open('#')" ์ด๊ฒƒ์„ ์ถ”๊ฐ€ํ•ด ์ฃผ๋ฉด ๋ฉ๋‹ˆ๋‹ค.

<button type="button" onclick="window.open('mypage.php')">๋งˆ์ดํŽ˜์ด์ง€ ๋ฐ”๋กœ๊ฐ€๊ธฐ</button>

3. ํŒ์—…์ฐฝ์œผ๋กœ ๋งํฌ ์—ด ๋•Œ

<button type="button" onclick="window.open('mypage.php','window_name','width=300,height=400,location=no,status=no,scrollbars=yes');">๋งˆ์ดํŽ˜์ด์ง€ ๋ฐ”๋กœ๊ฐ€๊ธฐ</button>

 

 

background css ์ถ•์•ฝ, ํ•œ๋ฒˆ์— ์“ฐ๋Š” ๋ฐฉ๋ฒ•, ์ค„์—ฌ์„œ ์จ๋ณด์ž

background css ์ถ•์•ฝ, ํ•œ๋ฒˆ์— ์“ฐ๋Š” ๋ฐฉ๋ฒ•, ์ค„์—ฌ์„œ ์จ๋ณด์ž. background css๋ฅผ ์ ์šฉํ•  ๋•Œ ๋งŽ์€ ์†์„ฑ๋“ค์ด ์žˆ๋‹ค. ์ด๊ฒƒ์„ ํ•œ๋ฒˆ์— ์ค„์–ด์„œ ์จ๋ณด์ž. background css .wrap { background-color:#CCC; background-image:url("image/photo1.png")

amango.tistory.com

 

hr ํƒœ๊ทธ css 100% ํ™œ์šฉํ•˜๊ธฐ(์ƒ‰์ƒ, ๋‘๊ป˜, ์ ์„ )

hr css๋กœ ์„ ์„ ์–‡๊ฒŒ ํ•˜๊ฑฐ๋‚˜ ์ ์„ ์œผ๋กœ ๋˜๋Š” ์ƒ‰์ƒ์„ ๋„ฃ์–ด์„œ ๊พธ๋ฐ€ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. hr ํƒœ๊ทธ๋Š” ์ˆ˜ํ‰์„ ์œผ๋กœ ๋‹จ๋ฝ๊ณผ ๋‹จ๋ฝ์„ ๊ฐ€๋กœ์„ ์œผ๋กœ ๊ตฌ๋ถ„ ์ง€์„ ๋•Œ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค. ๋‹ซ๋Š” ํƒœ๊ทธ ์—†์ด ํƒœ๊ทธ ํ•˜๋‚˜๋กœ ๊ฐ„๋‹จํžˆ ๊ฐ€๋กœ์„ 

amango.tistory.com