|
หัวข้อ: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: hastyman ที่ 01 มิถุนายน 2013, 14:27:04 มี body width 978 px อยู่ตรงกลาง
มีส่วนหัว width 978 px มี content width 600px อยู่ซ้าย มี sidebar width 340px อยู่ขวา มี footer width 978 px จะใช้อย่างไรดี ระหว่าง float ซ้าย-ขวา หรือใช้ Position บอกตำแหน่ง หรือจะใช้ display block เพื่อทำ Layout ควรจะเลือกอย่างดีครับ หัวข้อ: Re: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: mikeyx ที่ 01 มิถุนายน 2013, 14:29:50 float:right;
float:left; หัวข้อ: Re: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: kiraoji ที่ 01 มิถุนายน 2013, 15:25:45 มี content width 600px อยู่ซ้าย float:left
มี sidebar width 340px อยู่ขวา float:right หัวข้อ: Re: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: wasantec ที่ 01 มิถุนายน 2013, 15:54:55 html
<div class="layout-left"> </div> <div class="layout-right"> </div> css .layout-left { display: block; float: left; width: xxx px; min-height:xxx px; } .layout-right { display: block; float: left; width: xxx px; min-height:xxx px; } ประมาณนี้ได้ป่าว หัวข้อ: Re: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: chlorophill ที่ 01 มิถุนายน 2013, 16:06:27 แนะนำให้ศึกษา Framework ครับ
Bootstrap หรือ Foundation สองตัวนี้เป็นที่นิยม แล้วการกำหนด layout จะง่ายกว่าเดิมเยอะมาก หัวข้อ: Re: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: awayhost ที่ 01 มิถุนายน 2013, 16:18:58 float:right; float:left; อีกเสียงครับ ไม่ต้องมาหาตำแหน่ง Position ด้วย :wanwan020: ลืมบอก เวลา Float อย่าลืม Clear:both ด้วยเน้อ :P หัวข้อ: Re: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: max30012540 ที่ 01 มิถุนายน 2013, 17:07:26 float:right; ตามนี้ ใช่ร่วมกับ display:table จะดีมากๆfloat:left; หัวข้อ: Re: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: ชนเผ่าอาข่า ที่ 01 มิถุนายน 2013, 17:38:23 แนะนำให้ศึกษา Framework ครับ มันคือ ???Bootstrap หรือ Foundation สองตัวนี้เป็นที่นิยม แล้วการกำหนด layout จะง่ายกว่าเดิมเยอะมาก หัวข้อ: Re: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: gigkokman ที่ 01 มิถุนายน 2013, 17:55:52 แนะนำให้ศึกษา Framework ครับ Bootstrap หรือ Foundation สองตัวนี้เป็นที่นิยม แล้วการกำหนด layout จะง่ายกว่าเดิมเยอะมาก เชียร์ให้ใช้ framework (Bootstrap: http://twitter.github.io/bootstrap/) อีกคนครับ :wanwan020: หัวข้อ: Re: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: l3adtzl3oy ที่ 01 มิถุนายน 2013, 18:12:45 ทำโครงมาให้ รายละเอียดท่านจัดต่อได้เลย
จริงๆ ตามที่ท่าน chlorophill แนะนำเลยครับ แล้วชีวิตจะง่ายขึ้นเยอะ :wanwan019: <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="utf-8" /> <meta name="keywords" content="" /> <meta name="description" content="" /> <title></title> </head> <style> .containner { width:978px;height:500px;} header { height:100px; width:100%; background:#888; } content { width:600px; height:100%; background:#CCC; float:left; } sidebar { width:340px; height:100%; background:#AAA; float:right; } footer { height:50px; width:100%; background:#888; float:left; } </style> <body class="containner"> <header> <p>Header</p> </header> <content> <p>Display Content</p> </content> <sidebar> <p>Sidebar Start Here</p> </sidebar> <footer> <p>Copyright © Your name</p> </footer> </body> </html> แนะนำให้ศึกษา Framework ครับ มันคือ ???Bootstrap หรือ Foundation สองตัวนี้เป็นที่นิยม แล้วการกำหนด layout จะง่ายกว่าเดิมเยอะมาก คือ HTML framework ครับ มีของคนไทยด้วยชื่อ ใจดี เฟรมเวอร์ค Jaidee HTML Framework เป็นชุดคำสั่ง CSS และ JS ที่ได้รับการรวบรวมมาเพื่อตอบสนองการสร้างเว็บไซต์แบบ Responsive webdesign ซึ่งกำลังเป็นที่นิยมในปัจจุบัน Jaidee HTML Framework จัดเป็น HTML Framework ตัวแรกของไทย ซึ่งมีคุณสมบัติทัดเทียมกับ HTML Framework ของต่างชาติ คุณสมบัติโดยคร่าวๆ เขียนด้วย HTML5 และ CSS3 เป็นระบบที่สามารถปรับขนาดตัวเองให้เหมาะสมกับหน้าจอในแต่ละอุปกรณ์ มี Jquery plugin ยอดนิยมใช้ เช่น Slideshow, Tab, Modal มีระบบนำทาง (Site Navigator) ที่ปรับขนาดตัวเองให้รองรับทุกอุปกรณ์ Jaidee HTML Framework มีขนาดเล็กกว่า HTML Framework ตัวอื่นๆ Free 100 % & Opensource เยี่ยมชมหน้าโครงการได้ที่ http://develop.karmins.com/jaidee/ ที่มา: http://www.blognone.com/node/42710 หัวข้อ: Re: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: execter ที่ 01 มิถุนายน 2013, 19:44:05 960 grid system กับ bootstrap ลองศึกษาดูไม่ยาก
หัวข้อ: Re: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: Pink.in.th ที่ 01 มิถุนายน 2013, 20:51:50 html <div class="layout-left"> </div> <div class="layout-right"> </div> css .layout-left { display: block; float: left; width: xxx px; min-height:xxx px; } .layout-right { display: block; float: left; width: xxx px; min-height:xxx px; } ประมาณนี้ได้ป่าว ตามนี้ครับผม CSS ลองศึกษาดูอีกนิดเดียวก็ได้แล้วครับ อยู่กับมันเยอะ ๆ หน่อยผมว่าคุณทำได้ครับ ^^ หัวข้อ: Re: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: vanavat ที่ 01 มิถุนายน 2013, 21:13:27 html <div class="layout-left"> </div> <div class="layout-right"> </div> css .layout-left { display: block; float: left; width: xxx px; min-height:xxx px; } .layout-right { display: block; float: left; width: xxx px; min-height:xxx px; } ประมาณนี้ได้ป่าว <div class="layout-left"> </div> <div class="layout-right"> </div> css .layout-left { display: block; float: left; width: xxx px; min-height:xxx px; } .layout-right { display: block; float: right; width: xxx px; min-height:xxx px; } ไม่ใช่แบบนี้หรอครับ หัวข้อ: Re: ***เขียน css layout 2 คอลัมน์เขียนกันอย่างไรดี งงครับ เริ่มหัวข้อโดย: hastyman ที่ 04 มิถุนายน 2013, 22:40:07 +1 ทุกท่านครับ
ขอบคุณครับ ความจริงอยากได้ layout เป็น html 5 + css ครับ แต่ไม่เป็นไรครับ ขอบคุณอีก... |