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

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

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

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

กระทู้: 547



ดูรายละเอียด เว็บไซต์
« เมื่อ: 01 มกราคม 2013, 10:42:58 »

โค๊ด:
http://pokpik.com/2013/test_gossip.php?id_gossip=2161

จริงๆจะให้เนื้อหาข่าวเข้าไปอยู่ในกรอบสีขาว แต่มันหลุดกรอบครับ หาสาเหตุไม่เจอเลยจริงๆ
เพิ่งจับCSSได้ไม่นานครับ แก้ยังไง ขอความเมตตาแบ่งปันความรู้หน่อยครับ
 wanwan008

โค้ดหน้าแสดงผล
โค๊ด:
<div id="table">
  <p>
    <hd>:<? print"$title"; ?></hd>
    <br>
    <sd>โพสเมื่อ <? include("date.php");?> เปิดอ่าน <? print"$view"; ?></sd>
    <br><? print"$content"; ?>
  </p>
</div>

โค้ดCSS
โค๊ด:
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
#table {
      width:980px;padding-top:10px;margin-left:auto;margin-right:auto;background-color:#133a59;}
  #table p {
      width:92%;background-color:#FFF;margin-left:auto;margin-right:auto;padding: 10px 10px;}
  #table span {
      width:92%;}
  #table span.colp {
      width:60px;float:left;
  }
    #table span.colt {
      width:151px;height:65px;letter-spacing:0.5px;
  }
#table hd {color:#343434;margin-top:0%;margin-bottom:0%;font-size:60px;font-family:Fontcraft;}
#table sd {color:#666;margin-top:0%;margin-bottom:0%;font-size:30px;font-family:Fontcraft;}
บันทึกการเข้า

killer777
หัวหน้าแก๊งเสียว
*

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

กระทู้: 1,009



ดูรายละเอียด เว็บไซต์
« ตอบ #1 เมื่อ: 01 มกราคม 2013, 11:40:50 »

<p>
    <hd>:<? print"$title"; ?></hd>
    <br>
    <sd>โพสเมื่อ <? include("date.php");?> เปิดอ่าน <? print"$view"; ?></sd>
    <br><? print"$content"; ?>
  </p>

ลองเปลี่ยน p เป็น div ตามข้างล่างดูครับ

<div>
    <hd>:<? print"$title"; ?></hd>
    <br>
    <sd>โพสเมื่อ <? include("date.php");?> เปิดอ่าน <? print"$view"; ?></sd>
    <br><? print"$content"; ?>
  </div>
บันทึกการเข้า

dekmv
เจ้าพ่อบอร์ดเสียว
*

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

กระทู้: 3,264



ดูรายละเอียด เว็บไซต์
« ตอบ #2 เมื่อ: 01 มกราคม 2013, 13:03:42 »

ขอความรู้ด้วยคนนะครับ ^^  wanwan031
บันทึกการเข้า
zapdna
ก๊วนเสียว
*

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

กระทู้: 259



ดูรายละเอียด
« ตอบ #3 เมื่อ: 01 มกราคม 2013, 13:47:15 »

ลองใช้แบบนี้ดูครับ

อ้างถึง
body {
   margin-left: 0px;
   margin-top: 0px;
   margin-right: 0px;
   margin-bottom: 0px;
   background-color:#133a59;
}
#table {
      width:980px;padding-top:10px;margin-left:auto;margin-right:auto;background-color:#fff;}
  #table p {
      width:92%;background-color:#FFF;margin-left:10px;margin-right:auto;padding: 10px 10px;}
  #table span {
      width:92%;}
  #table span.colp {
      width:60px;float:left;
  }
    #table span.colt {
      width:151px;height:65px;letter-spacing:0.5px;
  }
#table hd {color:#343434;margin-top:0%;margin-bottom:0%;font-size:60px;font-family:Fontcraft;}
#table sd {color:#666;margin-top:0%;margin-bottom:0%;font-size:30px;font-family:Fontcraft;}

ส่วนไฟล์หน้าหลักเพิ่มบรรทัด <br /> หลัง <body> ก่อน <div id="table"> จะทำให้เห็นอยู่ในบล็อคครับ

### ข้างล่างนี้เป็นตัวที่ลองปรับแต่งตามแบบของผมนะครับ แก้ให้ใช้ H1 H2 แทนเพื่อผลในทาง SEO น่าจะดีกว่าใช้ตั้งเอง .. ####

อ้างถึง
*{padding:0; margin:0;}
body {   
   background-color:#133a59;   
}
h1 {padding-left:20px; color:#343434; font-size:40px; font-family:Fontcraft;}
h2 {padding-left:20px; color:#666; font-size:20px; font-family:Fontcraft;}
p {
      width:92%;background-color:#FFF;margin-left:auto;margin-right:auto;padding: 10px 10px; font-size:15px;}
#article {
      width:980px;padding-top:10px;margin-left:auto;margin-right:auto;background-color:#fff;}


ส่วนไฟล์แสดงผลปกติเวลาพิมพ์ข้อมูลใส่ฐานข้อมูลในแต่ละวรรคให้ใส่ <p>เนื้อหาแต่ละอัน</p> ลงไปแทนการใช้ <br />ส่วนรูปก็ใส่ title="$title" ต่อท้าย alt="$title" จะดีขึ้นนะครับ

อ้างถึง
<body>
&nbsp;
<div id="article">
  
    <H1>:<? print"$title"; ?></H1>
    <H2>โพสเมื่อ <? include("date.php");?> เปิดอ่าน <? print"$view"; ?> ครั้ง</H2>  
    <p><? print"$content"; ?></p>&nbsp;  
</div>
&nbsp;
« แก้ไขครั้งสุดท้าย: 01 มกราคม 2013, 15:27:42 โดย zapdna » บันทึกการเข้า
TonHaDy
หัวหน้าแก๊งเสียว
*

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

กระทู้: 1,134



ดูรายละเอียด เว็บไซต์
« ตอบ #4 เมื่อ: 01 มกราคม 2013, 14:12:58 »

ข้อความท่านไม่อยู่ใน <p> ครับ มันเลยไม่ขาวๆ

วิธีแก้โดยความคิดส่วนตัว
1. ท่านใช้ <!DOCTYPE HTML>  แต่ว่า code html อื่นๆท่านยังเปนแบบเดิมอยู่
2. ใช้ Tags ครอบ เนื้อข่าวทั้งหมดก่อน เช่น <div> <article> *อันหลังนี้เพราะเหนท่านใช้ HTML5
3. ไม่ต้องใช้ <br> ให้ใช้ <p>แทน แต่ละ วรรคของข้อความ จะได้ SEO ดีกว่า

ถ้าไม่เกิดประโยชน์ ขอให้ข้ามไป ไม่อยากกินมาม่ารับปีใหม่ ขอบคุงครับ
บันทึกการเข้า

aitim
สมุนแก๊งเสียว
*

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

กระทู้: 547



ดูรายละเอียด เว็บไซต์
« ตอบ #5 เมื่อ: 01 มกราคม 2013, 20:55:06 »

ลองปรับตามคำแนะนำก็ยังไม่ได้ครับ ผมแก้ข้อมูลในฐานข้อมูลจาก<br>เป็น<p>แล้วนะครับ
มันแสดงออกมาเป็นกล่องขาวหลายๆกล่อง ลองเข้าไปดูครับ จนปัญญาจริงๆครับ งงกับCSSมาก
ขอคำแนะนำหน่อยครับ
โค้ดCSS
โค๊ด:
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
#table {
      width:980px;padding-top:10px;margin-left:auto;margin-right:auto;background-color:#133a59;}
  #table p {
      width:92%;background-color:#FFF;margin-left:auto;margin-right:auto;padding: 10px 10px;font-size:15px;}
#table hd {color:#343434;margin-top:0%;margin-bottom:0%;font-size:60px;font-family:Fontcraft;}
#table sd {color:#666;margin-top:0%;margin-bottom:0%;font-size:30px;font-family:Fontcraft;}
#table H1 {color:#343434;margin-top:0%;margin-bottom:0%;font-size:40px;font-family:Fontcraft;}
#table H2 {color:#666;margin-top:0%;margin-bottom:0%;font-size:20px;font-family:Fontcraft;}
#article {
      width:980px;padding-top:10px;margin-left:auto;margin-right:auto;background-color:#fff;}

โค้ดแสดงผล
โค๊ด:
<? include('config.inc.php');
$sql = "select * from gossip where id_gossip ='$id_gossip'";
$dbquery = mysql_db_query($dbname, $sql);
$result = mysql_fetch_array($dbquery);
$sql2 = "UPDATE gossip SET view = view+1 WHERE id_gossip ='$id_gossip'";
include('bbcode.php'); ?><!DOCTYPE HTML>
<html>
<title><? print"$title"; ?>- ดารา นักแสดง นักร้อง เบื้องหลังกองถ่าย สัมภาษณ์ คลิปหลุด ดาราฮอลีวูด</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="stylesheet" type="text/css" href="readtable.css" />
<head>
<meta charset="utf-8" />
</head>
<body><div id="table">
  <p>
  <hd>:<? print"$title"; ?></hd><br>
  <sd>โพสเมื่อ <? include("date.php");?> เปิดอ่าน <? print"$view"; ?></sd>
    <? print"$content"; ?>
  </p>
</div>
</body>
</html>
บันทึกการเข้า

TonHaDy
หัวหน้าแก๊งเสียว
*

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

กระทู้: 1,134



ดูรายละเอียด เว็บไซต์
« ตอบ #6 เมื่อ: 01 มกราคม 2013, 22:33:16 »

ท่านสร้าง div มาอีกอัน ไว้นอก id="table"
แล้วตัวใหม่ที่สร้าง background-color: #133A59
แล้ว  id="table" ใส่สีขาวแทนครับ
บันทึกการเข้า

amjoey
คนรักเสียว
*

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

กระทู้: 101



ดูรายละเอียด เว็บไซต์
« ตอบ #7 เมื่อ: 02 มกราคม 2013, 13:32:40 »

อ่า มาดูเผื่อเอาไว้ใช้นะครับ wanwan016
บันทึกการเข้า

ทำงานริมทะเล ด้วยหัวใจที่มั่นคง
รับทำเว็บไซต์
yuseki
คนรักเสียว
*

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

กระทู้: 120



ดูรายละเอียด
« ตอบ #8 เมื่อ: 02 มกราคม 2013, 13:52:45 »

ตอนนี้คือได้แล้วใช่มั้ยคะ  wanwan021
บันทึกการเข้า
aitim
สมุนแก๊งเสียว
*

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

กระทู้: 547



ดูรายละเอียด เว็บไซต์
« ตอบ #9 เมื่อ: 02 มกราคม 2013, 19:30:38 »

ได้แล้วครับ Thanks ท่าน TonHaDy และ ท่าน zapdna คนละหนึ่งฉึก!
 wanwan013
บันทึกการเข้า

หน้า: [1]   ขึ้นบน
พิมพ์