Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 109,027

HOME > Community Zone > Forum > ถ้าจะกำหนด css ให้กับหน้าเว็บประมาณนี้ กำหนดยังไงเหรอครับ



 

ถ้าจะกำหนด css ให้กับหน้าเว็บประมาณนี้ กำหนดยังไงเหรอครับ

 



Topic : 045249

Guest




ไฟล์

ตามภาพด้านบน ผมกะว่าหน้าเว็บน่าจะออกมาประมาณนี้นะครับ

เวลากำหนด css ผมต้องกำหนดยังไงเหรอครับ แบบว่า เคยทำแต่ table อยากลองทำเป็น div+css ดูนะครับ

แต่ไม่รู้จะเริ่มแบ่งส่วนให้กับหน้าเพจยังไงดี ปกติถ้าเป็นเทเบิ้ลคงจะ

1. ทำเทเบิ้ลใหญ่สุดก่อน เป็นคอนเทนเนอร์
2. ที่เหลือก็ทำขนาดให้พอดีกับรูปแล้วก็จับใส่ ๆ

แต่พอมาเป็น css มองไม่เห็นภาพจริง ๆ ขอแนวทางหน่อยนะครับบ



Tag : - - - -







Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2010-07-10 14:55:30 By : m View : 1330 Reply : 4
 

 

No. 1



โพสกระทู้ ( 318 )
บทความ ( 2 )



สถานะออฟไลน์
Facebook

CSS ลองดูในดรีมนะจะได้เห็นภาพ
<div style="width:800px; height:800px; border:#000000 1px solid;">
<div style="width:800px; height:40px; border:#000000 1px solid; background-color:#000000; color:#FFFFFF">Drop down menu</div>
<div style="width:760px; height:80px; border:#000000 1px solid; background-color:#00000; color:#FFFFFF; margin-left:20px; margin-right:20px;">
<div style="width:380px; height:40px; border:#000000 1px solid; background-color:#FFFFFF; color:#000000;float:left;">Logo</div>
<div style="width:375px; height:40px; border:#000000 1px solid; background-color:#FFFFFF; color:#000000;float:left;">Search</div>
</div>
<div style="width:760px; height:140px; border:#000000 1px solid; background-color:#00000; color:#FFFFFF; margin-left:20px; margin-right:20px;">Flash</div>
<div style="width:760px; height:440px; border:#000000 1px solid; background-color:#FFFFFF; color:#00000; margin-left:20px; margin-right:20px; margin-top:20px;">
<div style="width:560px; height:440px;float:left">Body</div><div style="width:200px; height:440px;float:left">Menu</div>
</div>
<div style="width:800px; height:60px; border:#000000 1px solid; background-color:#000000; color:#FFFFFF; margin-top:20px;">Footer</div>
</div>
ดูเล่นๆนะนอกนั้นก็ลอกปรับแต่งเอา






Date : 2010-07-10 16:07:04 By : chineji
 


 

No. 2

Guest


โอโห เร็วสุดยอดครับ จะพยายามลองทำตามดูนะครับ

ขอบคุณมากครับ
Date : 2010-07-10 16:53:07 By : M
 

 

No. 3

Guest


คือส่วนนี้ บนสุด

<div style="width:800px; height:800px; border:#000000 1px solid;"> ที่ยังไม่ปิด </div>

เป็นเพราะว่า มันคือกรอปใหญ่สุดของเนื้อหาทั้งหมดใช่ปะคับ เลยเอาไปปิดไว้ล่างสุดแทน

คือ ถ้าจะจัดการกับกรอบไหนก็อย่าเพิ่งปิด div ใช่ปะคับ คือ ทำกล่องใหญ่ขึ้นมาก่อนแล้วก็ค่อยทำกล่องเล็กซ้อนลงไป
จัดขนาด แล้วค่อยปิด

เข้าใจถูกปะคับ ?? แอบงง
Date : 2010-07-10 16:59:48 By : M
 


 

No. 4

Guest


ถามเพิ่มได้ปะคับ อย่างเว็บนี้

http://www.natureexplorer.net/

ที่คาดดำ ๆ ที่ใช้เม้าชี้แล้ว มันก็ยืดขึ้นมา เค้าทำยังไงอะคับ มีพวกโค้ดเดโมรึเปล่าครับ ?
Date : 2010-07-10 17:13:02 By : M
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : ถ้าจะกำหนด css ให้กับหน้าเว็บประมาณนี้ กำหนดยังไงเหรอครับ
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ FTP| ใส่แถวของตาราง ใส่คอลัมน์ตาราง| ตัวยก ตัวห้อย ตัวพิมพ์ดีด| ใส่โค้ด ใส่การอ้างถึงคำพูด| ใส่ลีสต์
smiley for :lol: smiley for :ken: smiley for :D smiley for :) smiley for ;) smiley for :eek: smiley for :geek: smiley for :roll: smiley for :erm: smiley for :cool: smiley for :blank: smiley for :idea: smiley for :ehh: smiley for :aargh: smiley for :evil:
Insert PHP Code
Insert ASP Code
Insert VB.NET Code Insert C#.NET Code Insert JavaScript Code Insert C#.NET Code
Insert Java Code
Insert Android Code
Insert Objective-C Code
Insert XML Code
Insert SQL Code
Insert Code
เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

   
  เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง
 
โดย
อีเมล์
บวกค่าให้ถูก
<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)







Exchange: นำเข้าสินค้าจากจีน, Taobao, เฟอร์นิเจอร์, ของพรีเมี่ยม, ร่ม, ปากกา, power bank, แฟลชไดร์ฟ, กระบอกน้ำ

Load balance : Server 03
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2024 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่