[html] จะให้แบ๊กกราว กว้างเท่าบราวเซอร์และอยู่ข้างล่าง อย่างไรครับ ?

เริ่มโดย xmen256k, 02 สิงหาคม 2013, 20:11:55

หัวข้อก่อนหน้า - หัวข้อถัดไป

0 สมาชิก และ 1 ผู้มาเยือน กำลังดูหัวข้อนี้

พิมพ์
ลง หน้า1
การกระทำของผู้ใช้

xmen256k

02 สิงหาคม 2013, 20:11:55 แก้ไขล่าสุด: 02 สิงหาคม 2013, 20:13:17 โดย xmen256k


ตามรูปเลยครับ

อยากให้ขนาดของ background มีความกว้างเท่ากับขนาดของบราวเซอร์

และอยู่ด้านล่างด้วย

ไม่ทราบว่า ทำยังไงได้บ้างครับ

ขอบคุณครับ

max30012540

#1
02 สิงหาคม 2013, 20:16:09 แก้ไขล่าสุด: 02 สิงหาคม 2013, 20:18:30 โดย max30012540
โค้ด เลือก

background-size:cover;

หรือ
โค้ด เลือก

background-size:100%;

ลองดู 2 อย่างนี้ครับ

แล้วก็
โค้ด เลือก
background:url(ลิ้งรูป) bottom no-repeat;

xmen256k

#2
02 สิงหาคม 2013, 20:27:54
อ้างถึงจาก: max30012540 ใน 02 สิงหาคม 2013, 20:16:09
โค้ด เลือก

background-size:cover;

หรือ
โค้ด เลือก

background-size:100%;

ลองดู 2 อย่างนี้ครับ

แล้วก็
โค้ด เลือก
background:url(ลิ้งรูป) bottom no-repeat;

ยังไม่ได้อ่าครับ ไม่ขึ้นอะไรเลย

แต่ถ้าเปลี่ยนจาก bottom เป็น top มันก็จะโผล่ขึ้นมาแทน -*-

max30012540

#3
02 สิงหาคม 2013, 20:43:12
ได้ครับ
โค้ด เลือก

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
*{
background:url(http://a.lnwpic.com/_files/09/4c/sz.png) bottom no-repeat;
/*background-size:cover;*/
background-size:100%;
}
</style>
</head>

<body>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
</body>
</html>

xmen256k

#4
02 สิงหาคม 2013, 20:46:17
อ้างถึงจาก: max30012540 ใน 02 สิงหาคม 2013, 20:43:12
ได้ครับ
โค้ด เลือก

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
*{
background:url(http://a.lnwpic.com/_files/09/4c/sz.png) bottom no-repeat;
/*background-size:cover;*/
background-size:100%;
}
</style>
</head>

<body>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
</body>
</html>



สอบถามหน่อยครับ ทำไมมันถึงโชว์ในลักษณะแบบนี้อ่าครับ

ถ้าไม่ใช่ br มันไม่โชว์ เพราะอะไรเหรอครับ

ขอบคุณครับ

max30012540

#5
02 สิงหาคม 2013, 20:49:24
อ้างถึงจาก: xmen256k ใน 02 สิงหาคม 2013, 20:46:17
อ้างถึงจาก: max30012540 ใน 02 สิงหาคม 2013, 20:43:12
ได้ครับ
โค้ด เลือก

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
*{
background:url(http://a.lnwpic.com/_files/09/4c/sz.png) bottom no-repeat;
/*background-size:cover;*/
background-size:100%;
}
</style>
</head>

<body>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
</body>
</html>



สอบถามหน่อยครับ ทำไมมันถึงโชว์ในลักษณะแบบนี้อ่าครับ

ถ้าไม่ใช่ br มันไม่โชว์ เพราะอะไรเหรอครับ

ขอบคุณครับ
body จะเหมือนกับ Div ละครับ ความยาวจะขึ้นยู่กับเนื้อหา
การใช้ br เยอะๆ ทำให้เหมือนเป็นการสร้างเนื้อหาเว้นบรรทัดเยอะๆครับ จะทำให้รูปภาพขยับลงมาเรื่อยๆ
หากเนื้อหาไม่มี ก็จะไม่แสดง หรือมีน้อย ก็จะแสดงไม่เต็มครับ

ลองค่อยๆลบ br ออกครับ จะทำให้เข้าใจยิ่งขึ้น

xmen256k

#6
02 สิงหาคม 2013, 20:55:25
อ้างถึงจาก: max30012540 ใน 02 สิงหาคม 2013, 20:49:24
อ้างถึงจาก: xmen256k ใน 02 สิงหาคม 2013, 20:46:17
อ้างถึงจาก: max30012540 ใน 02 สิงหาคม 2013, 20:43:12
ได้ครับ
โค้ด เลือก

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
*{
background:url(http://a.lnwpic.com/_files/09/4c/sz.png) bottom no-repeat;
/*background-size:cover;*/
background-size:100%;
}
</style>
</head>

<body>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
</body>
</html>



สอบถามหน่อยครับ ทำไมมันถึงโชว์ในลักษณะแบบนี้อ่าครับ

ถ้าไม่ใช่ br มันไม่โชว์ เพราะอะไรเหรอครับ

ขอบคุณครับ
body จะเหมือนกับ Div ละครับ ความยาวจะขึ้นยู่กับเนื้อหา
การใช้ br เยอะๆ ทำให้เหมือนเป็นการสร้างเนื้อหาเว้นบรรทัดเยอะๆครับ จะทำให้รูปภาพขยับลงมาเรื่อยๆ
หากเนื้อหาไม่มี ก็จะไม่แสดง หรือมีน้อย ก็จะแสดงไม่เต็มครับ

ลองค่อยๆลบ br ออกครับ จะทำให้เข้าใจยิ่งขึ้น

แต่ว่าตอนใส่ bg ทั่วไปอ่าครับ
มันก็เห็นได้อ่าครับ โดยที่ไม่ต้องใส่ br
แต่ทำไมพอกำหนดให้มันอยู่ด้านล่าง ถึงต้องใส่อ่าครับ

มันเป้น บัค รึป่าวครับ ?

gp72343

#7
02 สิงหาคม 2013, 21:08:32 แก้ไขล่าสุด: 03 สิงหาคม 2013, 00:04:17 โดย gp72343
ไม่ต้องใส่ <br> ก็ได้นะฮะ แบบนี้
โค้ด เลือก
body,html{height:100%; padding: 0px; margin: 0px;}
:-*

แก้แล้วครับ :wanwan017:

max30012540

#8
02 สิงหาคม 2013, 22:49:41
อ้างถึงจาก: gp72343 ใน 02 สิงหาคม 2013, 21:08:32
ไม่ต้องใส่ <br> ก็ได้นะฮะ แบบนี้
โค้ด เลือก
body,html{height:100%; padding: 0px; margin: 0px;}
:-*

พวก body, div ฯลฯ ค่าเริ่มต้นมักจะเป็น 0 นะ เท่าที่ลองสังเกตุดู
ตามนี้ครับ กำหนดขนาดให้มัน

# ค่าเริ่มต้นคือ auto ครับ ไม่ใช่ 0
พิมพ์
ขึ้น หน้า1
การกระทำของผู้ใช้