เว็บบอร์ด PHP เว็บส่งเสริมการเรียนรู้ Hosting CRM ERP Server Programming ถาม-ตอบปัญหา

โดย **jamepiyawat** » 22/10/2019 6:03 pm

ทำได้แล้วครับ ขอบคุณครับ

โดยการกำหนด css ให้ใส่พื้นหลัง text box แบบนี้ครับ

textarea[type="text"]{
  background-image: url('imgdataset.png');
  background-repeat : no-repeat;
}

: Selection_999(1309).png (16.75 KiB) Viewed 1912 times

โดย **thatsawan** » 22/10/2019 5:34 pm

เราก็ใส่ class เเละกำหนดภาพใน class ก็ได้

โค้ด: เลือกทั้งหมด

.textInput {
 background: transparent;
 background-image: url(Images/textBg.jpg)
}

โค้ด: เลือกทั้งหมด

input[type=text] {
  width: 130px;
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  font-size: 16px;
  background-color: white;
  background-image: url('searchicon.png');
  background-position: 10px 10px; 
  background-repeat: no-repeat;
  padding: 12px 20px 12px 40px;
  -webkit-transition: width 0.4s ease-in-out;
  transition: width 0.4s ease-in-out;
}

https://www.w3schools.com/howto/tryit.a ... nim_search

โดย **jamepiyawat** » 22/10/2019 5:27 pm

placeholder สามารถแสดงข้อความได้แค่บรรทัดเดียว ครับแต่ข้อความตัวอย่างของผมจำเป็นจะต้องแสดงข้อความหลายบรรทัดแบบนี้ครับ

: Selection_999(1306).png (9.86 KiB) Viewed 1925 times

ผมจึงต้องทำให้ text box มีภาพพื้นหลังเพื่อจะทำให้ผู้ใช้เข้าใจวิธีการกรอกข้อมูลลง text box นี้ครับ

โดย **thatsawan** » 22/10/2019 5:23 pm

หมายถึง placeholder หรือป่าวค่ะ

โค้ด: เลือกทั้งหมด

<input name="keywords" id="keywords" type="search" maxlength="128" title="คีย์เวิร์ดสำหรับค้นหา" class="inputbox search tiny" size="20" value="" placeholder="ค้นหา">

placeholder คืออะไร
https://www.mindphp.com/forums/viewtopic.php?t=24026

ตัวอย่างการใช้งาน Class placeholder
https://www.mindphp.com/forums/viewtopic ... 76&t=19253

โดย **jamepiyawat** » 22/10/2019 5:19 pm

พอดีว่าผมต้องการจะใส่พื่นหลังให้กับ text box เพื่อเป็นการแสดงถึงตัวอย่างในการใช้งานครับ แต่ผมไม่ทราบวิธีทำครับ

จะทำอย่างไรให้ text box นั้นมีพื้นหลัง และถ้าเราคลิกที่ text box นั้นแล้วภาพพื้นหลังจะหายไปครับ

: Selection_999(1305).png (7.98 KiB) Viewed 1930 times

เว็บบอร์ด PHP เว็บส่งเสริมการเรียนรู้ Hosting CRM ERP Server Programming ถาม-ตอบปัญหา

วิธีทำให้ text box มีภาพพื้นหลัง ต้องทำอย่างไร ครับ

ตอบกระทู้

มุมมองที่ขยายได้ กระทู้แนะนำ: วิธีทำให้ text box มีภาพพื้นหลัง ต้องทำอย่างไร ครับ

Re: วิธีทำให้ text box มีภาพพื้นหลัง ต้องทำอย่างไร ครับ

Re: วิธีทำให้ text box มีภาพพื้นหลัง ต้องทำอย่างไร ครับ

Re: วิธีทำให้ text box มีภาพพื้นหลัง ต้องทำอย่างไร ครับ

Re: วิธีทำให้ text box มีภาพพื้นหลัง ต้องทำอย่างไร ครับ

วิธีทำให้ text box มีภาพพื้นหลัง ต้องทำอย่างไร ครับ