โดย jamepiyawat » 30/07/2019 4:37 pm
หลาย ๆ ท่านก็ที่จำเป็นจะต้องเคยทำ
css ที่หน้าเว็บกันมาบ้างแล้วสิ่งที่จำเป็นในการทำหน้าเว็บเลยก็คงจะต้องใช้
Bootstrap ออกมาใช้นั้นเองแต่ปัญหาก็คงจะเป็นที่ว่า
โค้ดอาจจะเยอะไปหน่อยหรือว่าเราไม่สามารถจำทุกโค้ดย่างแน่นอนสำหรับบทความนี้ก็จะเป็นการแสดงโค้นที่จะแสดงรูปภาพใด้ในขอบแบบไหนบ้างเราลองไปดูกันเลยดีกว่า
โดยโค้ดที่จะเป็นขอบแบบ 3 แบบนั้นก็คือ
img-rounded จะแสดงภาพแบบไม่มีขอบ
img-circle จะแสดงภาพเป็นวงกลม
img-polaroid จะแสดงภาพให้มีกรอมเพิ้มขึ้นมาก
สามารถเขียนโค้ดได้ตามนี้
โค้ด: เลือกทั้งหมด
<img src="..." class="img-rounded">
<img src="..." class="img-circle">
<img src="..." class="img-polaroid">
ผลลัพธ์ที่ได้
- Selection_999(186).png (4.93 KiB) Viewed 1042 times
เป็นอย่างไรกันบ้างล่ะครับสำหรับโค้ดการแสดงรูปภาพก็หวังว่าจะเอาไปใช้ในงานของตัวเองกันได้นะครับก็เป็นอะไรที่ง่ายกว่าที่คิดใช้ใช้ไหมล่ะครับก็หวังว่าผู้ที่ได้เข้ามาอ่านบทความนี้จะได้รับความรุ้ความเข้าใจกันไม่มากก็น้อยนะครับ
หลาย ๆ ท่านก็ที่จำเป็นจะต้องเคยทำ [url=https://www.mindphp.com/%E0%B8%84%E0%B8%B9%E0%B9%88%E0%B8%A1%E0%B8%B7%E0%B8%AD/73-%E0%B8%84%E0%B8%B7%E0%B8%AD%E0%B8%AD%E0%B8%B0%E0%B9%84%E0%B8%A3/2193-css-%E0%B8%84%E0%B8%B7%E0%B8%AD%E0%B8%AD%E0%B8%B0%E0%B9%84%E0%B8%A3.html]css[/url] ที่หน้าเว็บกันมาบ้างแล้วสิ่งที่จำเป็นในการทำหน้าเว็บเลยก็คงจะต้องใช้ [url=https://www.mindphp.com/%E0%B8%84%E0%B8%B9%E0%B9%88%E0%B8%A1%E0%B8%B7%E0%B8%AD/73-%E0%B8%84%E0%B8%B7%E0%B8%AD%E0%B8%AD%E0%B8%B0%E0%B9%84%E0%B8%A3/3963-bootstrap.html]Bootstrap[/url] ออกมาใช้นั้นเองแต่ปัญหาก็คงจะเป็นที่ว่า[url=https://www.mindphp.com/%E0%B8%84%E0%B8%B9%E0%B9%88%E0%B8%A1%E0%B8%B7%E0%B8%AD/73-%E0%B8%84%E0%B8%B7%E0%B8%AD%E0%B8%AD%E0%B8%B0%E0%B9%84%E0%B8%A3/3674-code-%E0%B9%82%E0%B8%84%E0%B9%89%E0%B8%94-%E0%B9%81%E0%B8%A5%E0%B8%B0-%E0%B8%A0%E0%B8%B2%E0%B8%A9%E0%B8%B2%E0%B8%97%E0%B8%B2%E0%B8%87%E0%B8%94%E0%B9%89%E0%B8%B2%E0%B8%99%E0%B8%84%E0%B8%AD%E0%B8%A1%E0%B8%9E%E0%B8%B4%E0%B8%A7%E0%B9%80%E0%B8%95%E0%B8%AD%E0%B8%A3%E0%B9%8C-%E0%B8%84%E0%B8%B7%E0%B8%AD%E0%B8%AD%E0%B8%B0%E0%B9%84%E0%B8%A3.html]โค้ด[/url]อาจจะเยอะไปหน่อยหรือว่าเราไม่สามารถจำทุกโค้ดย่างแน่นอนสำหรับบทความนี้ก็จะเป็นการแสดงโค้นที่จะแสดงรูปภาพใด้ในขอบแบบไหนบ้างเราลองไปดูกันเลยดีกว่า
โดยโค้ดที่จะเป็นขอบแบบ 3 แบบนั้นก็คือ
img-rounded จะแสดงภาพแบบไม่มีขอบ
img-circle จะแสดงภาพเป็นวงกลม
img-polaroid จะแสดงภาพให้มีกรอมเพิ้มขึ้นมาก
สามารถเขียนโค้ดได้ตามนี้
[code]<img src="..." class="img-rounded">
<img src="..." class="img-circle">
<img src="..." class="img-polaroid">[/code]
ผลลัพธ์ที่ได้
[attachment=0]Selection_999(186).png[/attachment]
เป็นอย่างไรกันบ้างล่ะครับสำหรับโค้ดการแสดงรูปภาพก็หวังว่าจะเอาไปใช้ในงานของตัวเองกันได้นะครับก็เป็นอะไรที่ง่ายกว่าที่คิดใช้ใช้ไหมล่ะครับก็หวังว่าผู้ที่ได้เข้ามาอ่านบทความนี้จะได้รับความรุ้ความเข้าใจกันไม่มากก็น้อยนะครับ