CSS การสร้างฟอร์มสำหรับรับค่าข้อมูล

CSS Knowledge เป็น บอร์ดรวามความรู้ CCC เน้นบทความ แนวทางการเขียนโปรแกรม บันทึกกันลืม เพื่อให้สมาชิกได้เขียนความรู้ที่ตัวเองมีให้สมาชิกท่านอื่นๆ ได้ เข้ามาอ่าน และ ไว้อ่านเองกันลืมด้วย

Moderators: mindphp, ผู้ดูแลกระดาน

GoB
PHP Super Member
PHP Super Member
Posts: 212
Joined: 12/01/2015 10:14 am

CSS การสร้างฟอร์มสำหรับรับค่าข้อมูล

Post by GoB » 02/02/2015 11:43 am

CSS การสร้างฟอร์มสำหรับรับค่าข้อมูล

เราสามารถกำหนดความกว้าง รวมถึงกำหนดสี ของกล่องรับค่า (Input) ซึ่งจะช่วยให้เว็บดูมีสีสัน และมีความเป็นระเบียบ ดูได้ง่ายมากขึ้น

Code: Select all

<html>
<head>
<style>
input[type=text] {
    width: 150px;		//ความกว้างของช่องรับค่า 
    display: block;		//แสดงผลเป็นลักษณะกล่อง ขึ้นบรรทัดใหม่
    margin-bottom: 10px;	//ระยะห่างของช่องรับค่า
    background-color: yellow;	//สีพื้นหลังในช่อง
}
input[type=button] {		//กำหนดรูปแบบของปุ่ม Button
    width: 120px;		//ความกว้าง
    display: block;		//แสดงผลเป็นลักษณะกล่อง ขึ้นบรรทัดใหม่
}
</style>
</head>
<body>
<form name="input" action="" method="get">	//กำหนดว่าจะส่งค่าไปที่ไฟล์ไหน
  รหัสสินค้า :<input type="text" name="Name">
  ชื่อสินค้า :<input type="text" name="Name" >
  <input type="button" value="บันทึกข้อมูล">
</form>
</body>
</html>
ผลลัพธ์ที่ได้
*****************************************************************
1.jpg
1.jpg (10.82 KiB) Viewed 531 times

Return to “CSS Knowledge”

Who is online

Users browsing this forum: No registered users and 13 guests