TIP : CSS ปิดการแสดงผลข้อความ โดยใช้เครื่องมือ "ตรวจดูส่วนประกอบ"

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

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

thatsawan
PHP VIP Members
PHP VIP Members
Posts: 19340
Joined: 31/03/2014 10:02 am
Contact:

TIP : CSS ปิดการแสดงผลข้อความ โดยใช้เครื่องมือ "ตรวจดูส่วนประกอบ"

Post by thatsawan » 07/01/2015 12:29 pm

จากบทความที่เเล้วได้ทำการแนะนำเครื่องมือช่วยในการพัฒนาเเละปรับแต่ง CSS พร้อมทั้งกับวิธีการใช้งานเบื้องต้นกันไปเเล้ว ในส่วนของตัวอย่างการใช้งานในเรื่องรายละเอียดต่างๆ ของเครื่องมือ จะขอเริ่มต้นการเเนะนำการใช้งานของ เครื่องมือ "ตรวจดูส่วนประกอบ" กันก่อน โดยบทความนี้จะยกตัวอย่างการ ปิดการแสดงผลของส่วนแสดงผลข้อความ ซึ่งจะมีขั้นตอนง่ายๆ ดังนี้ค่ะ
7-1-2558 12-18-42.jpg
7-1-2558 12-18-42.jpg (69.84 KiB) Viewed 632 times
ผลลัพท์ที่ได้ค่ะ
1. ให้ทำการเปิดการใช้งานเครื่องมือค่ะ
- คลิกขวา เลือกที่ "ตรวจดูส่วนประกอบ"
- หาตำแหน่งของ Class โดยการคลิกที่เครื่องมือ
7-1-2558 12-23-51.jpg
7-1-2558 12-23-51.jpg (912 Bytes) Viewed 632 times
- *ในตัวอย่างเราจะปิดการเเสดงผลข้อความของหน้าจอ ขนาดมือถือ เราก็จะใช้เครื่องมือ
7-1-2558 12-24-08.jpg
7-1-2558 12-24-08.jpg (1.18 KiB) Viewed 632 times
เพื่อให้เครื่องมือจำลองหน้าจอมือถือให้เราค่ะ
- ที่นี่ให้เรานำเมาส์ไปคลิกให้เกิดกรอบของข้อความตำแหน่งของที่เราจะทำงาน สังเกตุช่องทางด้านซ้ายมือจะแสดงเเท็ก HTML ที่เรียกใช้งาน
[/color]
7-1-2558 12-05-28.jpg
7-1-2558 12-05-28.jpg (141.14 KiB) Viewed 632 times
2.เมื่อเราได้ตำแหน่งของ Class ที่นี่ลองมองมาทางซ้ายมือค่ะ เราจะเห็นคุณสมบัติของ Class นั้นๆ ที่นี่เราก็จะหา Class ของ ที่เราจะทำการปิดเเล้ว เราสามารถที่จะเพิ่มคุณสมบัติลงไปในช่องทางด้านซ้ายมือได้เลยค่ะ จากนั้นดูการแสดงผลตัวอย่าง
7-1-2558 12-09-14.jpg
7-1-2558 12-09-14.jpg (129.32 KiB) Viewed 632 times
** เสร็จเเล้วค่ะ เพียงเเค่ 2 ขั้นตอนในการใช้งานเครื่องมือช่วยพัฒนาเเละปรับเเต่ง CSS **

Return to “CSS Knowledge”

Who is online

Users browsing this forum: jamepiyawat and 15 guests