เวลาพิมพ์ออกมา เส้นตารางไม่ขึ้นค่ะ ต้องแก้ตรงไหนค่ะ

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา เวลาพิมพ์ออกมา เส้นตารางไม่ขึ้นค่ะ ต้องแก้ตรงไหนค่ะ

เวลาพิมพ์ออกมา เส้นตารางไม่ขึ้นค่ะ ต้องแก้ตรงไหนค่ะ


 <table width="100%" border="1" cellpadding="0" cellspacing="0">
      <tr align="center" style="font-weight:bold;">
        <td width="5%" class="borderTop borderLeft borderBottom" height="30px">ITEM</td>
        <td width="80%" class="borderTop borderLeft borderBottom" colspan="3">PRODUCTS</td>
        <td colspan="2" class="borderTop borderLeft borderBottom">QTY          </td>
        <td width="12%" class="borderTop borderLeft borderBottom">PRICE/UNIT</td>
		<td width="14%" class="borderTop borderLeft borderBottom">DISCOUNT/@</td>
        <td width="7%" class="borderTop borderLeft borderRight borderBottom">TOTAL</td>
      </tr>
</table>

<style type="text/css">
td.borderLeft { border-left-width: 2px; border-left-style: solid; border-left-color: #C03; }
td.borderRight { border-right-width: 2px; border-right-style: solid; border-right-color: #C03; }
td.borderTop { border-top-width: 2px; border-top-style: solid; border-top-color: #C03; }
td.borderBottom { border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: #C03; }
</style>


Saranya2532 12-09-2014 17:51:27

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
  • เปลี่ยน


    ( หรือ เข้าใช้งานผ่าน Social Login )

 ความคิดเห็นที่ 1
ผมลองเอาโค้ดมา รันในเครื่อง ผมก็ขึ้นนะ
css ต้องลองไล่ ดูว่า มีตัวไหนไปกำหนดค่า ให้ ไม่มีขอบหรือเปล่า

ลองเอาไปรันดูโค้ดนี้

<style type="text/css">
	.table {
		width:100%;
		border:1px solid #000000;	
	}
	.table table{
		border-collapse: collapse;
		border-spacing: 0;
		width:100%;
		height:100%;

	}
	.table thead tr{ 
		font-weight: bold;
		background-color:#ffaa56;		
		font-size: 16px; 
	}
	.table thead td {
		text-align: center;
	}
	.table thead td:nth-child(1){width: 5%;}
	.table thead td:nth-child(2){width: 60%;}
	.table thead td:nth-child(3){width: 5%;}
	.table thead td:nth-child(4){width: 10%;}
	.table thead td:nth-child(5){width: 10%;}
	.table thead td:nth-child(5){width: 10%;}
	.table tr:nth-child(even){ background-color:#ffaa56; }
	.table td{
		vertical-align:middle;	
		border:1px solid #000000;		
		text-align:left;
		padding:7px;
		font-size:10px;		
		color:#000000;
	}

	</style> 
	

	
	<div class="table" >
		<table >
			<thead>
				<tr>
					<td>ITEM</td>
					<td>PRODUCTS</td>
					<td>QTY</td>
					<td>PRICE/UNIT</td>
					<td>DISCOUNT/@</td>
					<td>TOTAL</td>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td>Row 2</td>
					<td>Row 2</td>
					<td>Row 2</td>
					<td>Row 2</td>
					<td>Row 2</td>
					<td>Row 2</td>
				</tr>
				<tr>
					<td>Row 3</td>
					<td>Row 3</td>
					<td>Row 3</td>
					<td>Row 3</td>
					<td>Row 3</td>
					<td>Row 3</td>
				</tr>
				<tr>
					<td>Row 4</td>
					<td>Row 4</td>
					<td>Row 4</td>
					<td>Row 4</td>
					<td>Row 4</td>
					<td>Row 4</td>
				</tr>
				<tr>
					<td>Row 5</td>
					<td>Row 5</td>
					<td>Row 5</td>
					<td>Row 5</td>
					<td>Row 5</td>
					<td>Row 5</td>
				</tr>
			</tbody>
		</table>
	</div>

ใช้โปรแกรมสร้างเอา


wowowow 12-09-2014 20:53
 ความคิดเห็นที่ 2
ได้แล้วค่ะ คือต้องเอาโค้ดไว้หน้าเดียวกัน ตอนแรกเอาไว้หน้า .css แล้วเรียกใช้  มันเลยไม่ขึ้นค่ะ ขอบคุณนะคะ


saranya2532 15-09-2014 08:28






เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ