ยินดีต้อนรับคุณ, บุคคลทั่วไป กรุณา เข้าสู่ระบบ หรือ ลงทะเบียน

เข้าสู่ระบบด้วยชื่อผู้ใช้ รหัสผ่าน และระยะเวลาในเซสชั่น

ThaiSEOBoard.comพัฒนาเว็บไซต์Programmingใครเก่ง bootstap ช่วยหน่อยครับ
หน้า: [1]   ลงล่าง
พิมพ์
ผู้เขียน หัวข้อ: ใครเก่ง bootstap ช่วยหน่อยครับ  (อ่าน 1165 ครั้ง)
0 สมาชิก และ 1 บุคคลทั่วไป กำลังดูหัวข้อนี้
noong
Newbie
*

พลังน้ำใจ: 0
ออฟไลน์ ออฟไลน์

กระทู้: 33



ดูรายละเอียด เว็บไซต์
« เมื่อ: 30 สิงหาคม 2014, 18:38:44 »

เพิ่งลองเล่น คือผมใช้ php ดึงจากฐานข้อมูลมา ซ้ำๆ  แล้ว ต้องการให้มันเรียงจาก ซ้ายไปขวา ไม่ได้อะครับ มันเรียงจากบนลงล่างอย่างเดียว ขอคำแนะนำหน่อยครับ
บันทึกการเข้า

แนะนำ ที่เที่ยว ในตรัง : http://www.trangtravel.com
ทัวร์ทะเล อันดามัน ระนอง  ภูเก็ต พังงา กระบี่ ตรัง สตูล : http://www.guidetrang.com
gapgag55
สมุนแก๊งเสียว
*

พลังน้ำใจ: 143
ออฟไลน์ ออฟไลน์

กระทู้: 622



ดูรายละเอียด
« ตอบ #1 เมื่อ: 30 สิงหาคม 2014, 18:49:12 »

ลองใส่ class = " row " ดูก่อนนะครับ

<div class="row">
  <div class="col-md-1">.col-md-1</div>
</div>
บันทึกการเข้า

noong
Newbie
*

พลังน้ำใจ: 0
ออฟไลน์ ออฟไลน์

กระทู้: 33



ดูรายละเอียด เว็บไซต์
« ตอบ #2 เมื่อ: 30 สิงหาคม 2014, 19:07:43 »

ลองใส่ class = " row " ดูก่อนนะครับ

<div class="row">
  <div class="col-md-1">.col-md-1</div>
</div>


ลองแล้วครับ

<div class="row">
  <div class="col-md-4">
       

<?

$db->connectdb(DB_NAME,DB_USERNAME,DB_PASSWORD);
$res[news] = $db->select_query("SELECT * FROM ".TB_NEWS." ORDER BY id DESC LIMIT 3 ");
while($arr[news] = $db->fetch($res[news])){
   //Comment Icon
   if($arr[news][enable_comment]){
      $CommentIcon = " <IMG SRC=\"images/icon/suggest.gif\" WIDTH=\"2\" HEIGHT=\"9\" BORDER=

\"0\" ALIGN=\"absmiddle\">";
   }else{
      $CommentIcon = "";
   }
?>
         

               <p><A HREF="?name=news&file=readnews&id=<?=$arr[news][id];?>"

target="_blank" class="thumbnail "><IMG SRC="newsicon/<?=$arr[news][post_date];?>.jpg" class="img-

responsive "></A>

<h4><?=$arr[news][topic];?></h4>
<p><?=$arr[news][headline];?></p>
         
<?
}
$db->closedb ();

?></p>


</div>   
</div>


ผลที่ได้

บันทึกการเข้า

แนะนำ ที่เที่ยว ในตรัง : http://www.trangtravel.com
ทัวร์ทะเล อันดามัน ระนอง  ภูเก็ต พังงา กระบี่ ตรัง สตูล : http://www.guidetrang.com
gapgag55
สมุนแก๊งเสียว
*

พลังน้ำใจ: 143
ออฟไลน์ ออฟไลน์

กระทู้: 622



ดูรายละเอียด
« ตอบ #3 เมื่อ: 30 สิงหาคม 2014, 19:09:10 »

เหมือนมันจะอยู่ข้างใน div อีกตัวนึงอะครับ ขอดูโค้ดเต็มได้ไหมครับ  wanwan011
บันทึกการเข้า

9wong
ก๊วนเสียว
*

พลังน้ำใจ: 35
ออฟไลน์ ออฟไลน์

กระทู้: 234



ดูรายละเอียด
« ตอบ #4 เมื่อ: 30 สิงหาคม 2014, 19:12:02 »

try it ยังไม่ได้ลองไล่โค๊ดครับ พอดีไม่สะดวก
โค๊ด:
<div class="row">
       

<?

$db->connectdb(DB_NAME,DB_USERNAME,DB_PASSWORD);
$res[news] = $db->select_query("SELECT * FROM ".TB_NEWS." ORDER BY id DESC LIMIT 3 ");
while($arr[news] = $db->fetch($res[news])){
echo '  <div class="col-md-4">';
   //Comment Icon
   if($arr[news][enable_comment]){
      $CommentIcon = " <IMG SRC=\"images/icon/suggest.gif\" WIDTH=\"2\" HEIGHT=\"9\" BORDER=

\"0\" ALIGN=\"absmiddle\">";
   }else{
      $CommentIcon = "";
   }
?>
         

               <p><A HREF="?name=news&file=readnews&id=<?=$arr[news][id];?>"

target="_blank" class="thumbnail "><IMG SRC="newsicon/<?=$arr[news][post_date];?>.jpg" class="img-

responsive "></A>

<h4><?=$arr[news][topic];?></h4>
<p><?=$arr[news][headline];?></p>
  echo '</div> ';       
<?
}
$db->closedb ();

?></p>


 
</div>



bootstap  ใช้เป็นระบบ 12 grid ครับ

อยากได้แบบไหนใส่ class row แล้วก็ตามด้วย col-md-*  ->* คือหมายเลข 1-12
***มันมีหลายตัวมากครับ col-xs สำหรับ พวกโทรศัพท์  col-sm สำหรับ แท็บเล็ต  col-md ก็ desktop  แล้วก็ col-lg สำหรับพวกจอ 1200 px+

ตัวอย่างสมมุติผมอยากจัดเรียงแบบนี้

content1 | content 2 | content 3

ก็เขียน
โค๊ด:
<div class="container">
<div class="row">
<div class="col-md-4">content1</div>
<div class="col-md-4">content 2</div>
<div class="col-md-4">content 3</div>
</div>
</div>
บันทึกการเข้า
noong
Newbie
*

พลังน้ำใจ: 0
ออฟไลน์ ออฟไลน์

กระทู้: 33



ดูรายละเอียด เว็บไซต์
« ตอบ #5 เมื่อ: 30 สิงหาคม 2014, 19:33:03 »

เหมือนมันจะอยู่ข้างใน div อีกตัวนึงอะครับ ขอดูโค้ดเต็มได้ไหมครับ  wanwan011


อ่าผม ปิด div หมดแล้วต่อท้ายนะครับ เริ่มใหม่เลย

<div class="container">

<div class="row">


<div class="col-lg-4">
<div class="list-group-item">   
<img class="img-responsive" src="images/logo.png"><br>      
<?
//แสดงข่าวสาร/ประชาสัมพันธ์
$db->connectdb(DB_NAME,DB_USERNAME,DB_PASSWORD);
$res[news] = $db->select_query("SELECT * FROM ".TB_NEWS." ORDER BY id DESC LIMIT 5 ");
while($arr[news] = $db->fetch($res[news])){
   //Comment Icon
   if($arr[news][enable_comment]){
      $CommentIcon = " <IMG SRC="images/icon/suggest.gif" WIDTH="2" HEIGHT="9" BORDER=

"0" ALIGN="absmiddle">";
   }else{
      $CommentIcon = "";
   }
?>
         

               <p><A HREF="?name=news&file=readnews&id=<?=$arr[news][id];?>"

target="_blank" class="thumbnail "><IMG SRC="newsicon/<?=$arr[news][post_date];?>.jpg" class="img-

responsive "></A>

<h4><?=$arr[news][topic];?></h4>
<p><?=$arr[news][headline];?></p>
         
<?
}
$db->closedb ();
//จบการแสดงข่าวสาร
?></p>

         

</div>
</div>

<!-- End Left -->


<div class="col-md-8">         
<div class="alert alert-info" role="alert">

<?
$FileEditorTalk = "editortalk/editortalk.html";
$FileEditorTalkOpen = @fopen($FileEditorTalk, "r");
$EditorTalkContent = @fread ($FileEditorTalkOpen, @filesize($FileEditorTalk));
@fclose ($FileEditorTalkOpen);
$EditorTalkContent = stripslashes($EditorTalkContent);
echo $EditorTalkContent;
?>
               
<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item" src="http://www.youtube.com/v/HGTrYJkx-EA "

allowfullscreen="yes"></iframe>
</div>
         
 

   
<div class="panel panel-danger">
   <div class="panel-heading">
      <h3 class="panel-title">Program Tour Trang | โปรแกรมทัวร์ ตรัง</h3>
   </div></div>

<?
//แสดงบทความ Text Random
$db->connectdb(DB_NAME,DB_USERNAME,DB_PASSWORD);
$res[knowledge] = $db->select_query("SELECT * FROM ".TB_KNOWLEDGE." ORDER BY rand() LIMIT 5 ");
while($arr[knowledge] = $db->fetch($res[knowledge])){
?>   

     
<div class="list-group-item">
<div class="thumbnail clearfix">               
<A HREF="?name=knowledge&file=readknowledge&id=<?=$arr[knowledge][id];?>" target="_blank" >
               
<IMG SRC="knowledgeicon/<?=$arr[knowledge][post_date];?>.jpg" class="pull-right thumbnail" ?></A>
<div class="caption" class="pull-left">

<h4><?=$arr[knowledge][topic];?></h4>
<?=$arr[knowledge][headline];?>
<?if($arr[knowledge][enable_comment]){echo ">";}else{};?><p> <A HREF="?

name=knowledge&file=readknowledge&id=<?=$arr[knowledge][id];?>" target="_blank"  class="btn btn-primary

btn-sm" role="button">More</a></p></div> </div>
</div>

<?
}
$db->closedb ();
//จบการแสดงบทความ Text Random
?>
</div>   
</div>

</div>


   </div>   

//ตรงนี้ครับที่เริ่มใหม่


<div class="container">
<div class="row ">
<div class="col-md-4">


<?
//แสดงข่าวสาร/ประชาสัมพันธ์
$db->connectdb(DB_NAME,DB_USERNAME,DB_PASSWORD);
$res[news] = $db->select_query("SELECT * FROM ".TB_NEWS." ORDER BY id DESC LIMIT 5 ");
while($arr[news] = $db->fetch($res[news])){
   //Comment Icon
   if($arr[news][enable_comment]){
      $CommentIcon = " <IMG SRC="images/icon/suggest.gif" WIDTH="2" HEIGHT="9" BORDER=

"0" ALIGN="absmiddle">";
   }else{
      $CommentIcon = "";
   }
?>
         

               <p><A HREF="?name=news&file=readnews&id=<?=$arr[news][id];?>"

target="_blank" class="thumbnail "><IMG SRC="newsicon/<?=$arr[news][post_date];?>.jpg" class="img-

responsive "></A>

<h4><?=$arr[news][topic];?></h4>
<p><?=$arr[news][headline];?></p>
         
<?
}
$db->closedb ();
//จบการแสดงข่าวสาร
?></p>



</div>

</div>
</div>


   
บันทึกการเข้า

แนะนำ ที่เที่ยว ในตรัง : http://www.trangtravel.com
ทัวร์ทะเล อันดามัน ระนอง  ภูเก็ต พังงา กระบี่ ตรัง สตูล : http://www.guidetrang.com
noong
Newbie
*

พลังน้ำใจ: 0
ออฟไลน์ ออฟไลน์

กระทู้: 33



ดูรายละเอียด เว็บไซต์
« ตอบ #6 เมื่อ: 30 สิงหาคม 2014, 19:43:57 »

อ่าได้แล้วครับ  ขอบคุณ พี่ๆทุกคนครับผม :wanwan020:เดี๋ยวเสร็จมาลงลิ้งให้ครับ มาเที่ยวตรังกันนะครับ อิอิ
« แก้ไขครั้งสุดท้าย: 30 สิงหาคม 2014, 21:57:18 โดย noong » บันทึกการเข้า

แนะนำ ที่เที่ยว ในตรัง : http://www.trangtravel.com
ทัวร์ทะเล อันดามัน ระนอง  ภูเก็ต พังงา กระบี่ ตรัง สตูล : http://www.guidetrang.com
scanfire
ก๊วนเสียว
*

พลังน้ำใจ: 23
ออฟไลน์ ออฟไลน์

กระทู้: 245



ดูรายละเอียด เว็บไซต์
« ตอบ #7 เมื่อ: 30 สิงหาคม 2014, 19:57:25 »

แก้เสดแล้วเปลี่ยน bg ด้วยนะครับไม่เข้ากันเลย
บันทึกการเข้า

ทำเว็บไซต์ Magento, รับทำเว็บไซน์ขายของ ,รับตัดเว็บไซต์ responsive  ,รับทำแอพมือถือ ,สอนเขียนโปรแกรม, บริษัทรับทำเว็บไซต์
โทร : 0970011614, 063-187-5099
email : [email protected]
noong
Newbie
*

พลังน้ำใจ: 0
ออฟไลน์ ออฟไลน์

กระทู้: 33



ดูรายละเอียด เว็บไซต์
« ตอบ #8 เมื่อ: 30 สิงหาคม 2014, 20:02:51 »

แก้เสดแล้วเปลี่ยน bg ด้วยนะครับไม่เข้ากันเลย

ครับผ้ม  wanwan004
บันทึกการเข้า

แนะนำ ที่เที่ยว ในตรัง : http://www.trangtravel.com
ทัวร์ทะเล อันดามัน ระนอง  ภูเก็ต พังงา กระบี่ ตรัง สตูล : http://www.guidetrang.com
JumDaiDee
สมุนแก๊งเสียว
*

พลังน้ำใจ: 18
ออฟไลน์ ออฟไลน์

กระทู้: 566



ดูรายละเอียด
« ตอบ #9 เมื่อ: 02 กันยายน 2014, 08:07:24 »

เพิ่มเติมนะครับ เท่าที่ผมใช้มา

ถ้าเราเอา <div class="row"> ไว้ใน ลูป มันจะขึ้นบรรทัดใหม่ทันที่

เพราะ แท็ก <div class="row"> มันจะขึ้นบรรัทดใหม่ครับ

ถ้าไม่อยากให้ขึ้นใหม่ก็ทำแบบนี้ครับ
<div class="row">
while($rs = $q->fetch_assoc()){

<div class="col-lg-4"><?=$rs['name']?></div>

}
</div>

เอาแท็ก <div class="row"> ไว้นอกลูป จบครับ
บันทึกการเข้า

สินค้าออนไลน์ https://www.shoppook.com/product | โปรแกรมออนไลน์ : https://appnon.com
หน้า: [1]   ขึ้นบน
พิมพ์