หน้าแรก
หน้าแรก
ใช้ตัวเลือก CSS :out-of-range เพื่อจัดรูปแบบ องค์ประกอบที่มีค่านอกช่วงที่ระบุ ตัวอย่าง คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้ตัวเลือก :out-of-range: <!DOCTYPE html> <html> <head> <style> input:out-of-rang
ใช้ตัวเลือก CSS :out-of-range เพื่อจัดรูปแบบ องค์ประกอบที่มีค่านอกช่วงที่ระบุ ตัวอย่าง คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน :out-of-range selector <!DOCTYPE html> <html> <head> <style> input:out-of-r
ใช้ CSS :read-only selector เพื่อเลือกองค์ประกอบที่เป็นแบบอ่านอย่างเดียว ตัวอย่าง คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้ตัวเลือก :read-only: <!DOCTYPE html> <html> <head> <style> input:read-only { &
ในการเลือกองค์ประกอบแบบอ่านอย่างเดียว ให้ใช้ CSS :read-only selector ตัวอย่าง คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน :read-only selector <!DOCTYPE html> <html> <head> <style> input:read-only { &n
ใช้ CSS :read-write selector เพื่อเลือกองค์ประกอบที่ อ่านได้ และ เขียนได้ ตัวอย่าง คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้ตัวเลือก :read-write: <!DOCTYPE html> <html> <head> <style> input:read-write {
ใช้ตัวเลือก CSS :link เพื่อจัดรูปแบบลิงก์ที่ยังไม่ได้เยี่ยมชมทั้งหมด คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน :link selector - ตัวอย่าง <!DOCTYPE html> <html> <head> <style> a:link { &
หากต้องการจัดรูปแบบลิงก์ที่ยังไม่ได้เยี่ยมชมทั้งหมด ให้ใช้ตัวเลือก CSS :link คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน :link selector: ตัวอย่าง <!DOCTYPE html> <html> <head> <style> a:link { &
ใช้ตัวเลือก CSS :not(selector) เพื่อจัดรูปแบบทุกองค์ประกอบที่ไม่ใช่องค์ประกอบที่ระบุ คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน :not selector ตัวอย่าง <!DOCTYPE html> <html> <head> <style> p {
ใช้ตัวเลือก CSS :nth-child(n) เพื่อจัดรูปแบบทุก องค์ประกอบที่เป็นลูกคนที่สองของพาเรนต์ที่มี CSS คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้ตัวเลือก :nth-child(n) ตัวอย่าง p:nth-child (4) { พื้นหลัง:สีส้ม; สี:ขาว; } นี่คือข้อความสาธิต 1 นี่คือข้อความสาธิต 2 นี่คือข้อความสาธิต 3 นี่คือข้อความสาธิต
คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้การแปลงแกน X 3D ด้วย CSS3 ตัวอย่าง <html> <head> <style> div { width: 200px; height: 100px
หากต้องการจัดรูปแบบทุก องค์ประกอบที่เป็นลูกคนที่สองของพาเรนต์ด้วย CSS ให้ใช้ตัวเลือก CSS :nth-child(n) ตัวอย่าง คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้ตัวเลือก :nth-child(n) p:nth-child (4) { พื้นหลัง:สีส้ม; สี:ขาว; } นี่คือข้อความสาธิต 1 นี่คือข้อความสาธิต 2 นี่คือข้อความสาธิต 3 นี่คือข้อ
ใช้ตัวเลือก CSS :nth-last-of-type(n) เพื่อเลือกทุกองค์ประกอบ ที่เป็นองค์ประกอบ ที่สองขององค์ประกอบหลัก โดยนับจากลูกสุดท้าย ตัวอย่าง คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้ตัวเลือก :nth-last-of-type(n): <!DOCTYPE html> <html> <head> <style>
ใช้ตัวเลือก CSS :nth-of-type(n) เพื่อจัดรูปแบบทุก ๆ องค์ประกอบที่เป็นองค์ประกอบ nth ของพาเรนต์ คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้ตัวเลือก :nth-of-type(n) ตัวอย่าง <!DOCTYPE html> <html> <head> <style>
ต่อไปนี้เป็นวิธีการที่ใช้ในการเรียกการแปลง 3 มิติ: ค่า คำอธิบาย matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n, น น น น) ใช้เพื่อแปลงองค์ประกอบโดยใช้ค่าเมทริกซ์ 16 ค่า translate3d(x,y,z) ใช้เพื่อแปลงองค์ประกอบโดยใช้แกน x แกน y และแกน z translateX(x) ใช้เพื่อแปลงองค์ประกอบโดยใช้แกน x transla
ใช้ตัวเลือก CSS :nth-of-type(n) เพื่อจัดรูปแบบทุก ๆ องค์ประกอบที่เป็นองค์ประกอบ nth ของพาเรนต์ คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้ตัวเลือก :nth-of-type(n) ตัวอย่าง <!DOCTYPE html> <html> <head> <style>
ในการจัดรูปแบบลิงก์เมื่อวางเมาส์ไว้เหนือด้วย CSS ให้ใช้ CSS:ตัวเลือกโฮเวอร์ คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน:โฮเวอร์ ตัวเลือก ตัวอย่าง <!DOCTYPE html> <html> <head> <style> a:hover {
ใช้ตัวเลือก CSS :in-range เพื่อจัดรูปแบบองค์ประกอบ ด้วยค่าภายในช่วงที่ระบุ คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน :in-range selector - ตัวอย่าง <!DOCTYPE html> <html> <head> <style> input:in-range { &nb
ใช้ตัวเลือก CSS :invalid เพื่อจัดรูปแบบองค์ประกอบ ทั้งหมดด้วยค่าที่ไม่ถูกต้อง คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน :invalid selector ตัวอย่าง <!DOCTYPE html> <html> <head> <style> input:invalid { &nb
หากต้องการจัดรูปแบบองค์ประกอบ ทั้งหมดที่มีค่าที่ไม่ถูกต้อง ให้ใช้ CSS :invalid selector ตัวอย่าง คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน :invalid selector - <!DOCTYPE html> <html> <head> <style> input:i
ใช้ตัวเลือก CSS :lang เพื่อจัดรูปแบบทุก องค์ประกอบด้วยค่าแอตทริบิวต์ lang คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน :lang selector: ตัวอย่าง <!DOCTYPE html> <html> <head> <style> p:lang(fr) {