Computer >> คอมพิวเตอร์ >  >> การเขียนโปรแกรม >> CSS
CSS
  1. คุณสมบัติการเพิ่มเคาน์เตอร์ CSS

    หากต้องการเพิ่มค่าตัวนับด้วย CSS ให้ใช้ ตัวนับ ไม่ ทรัพย์สิน คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน counter-implement ทรัพย์สิน − ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style>          body {      

  2. Fade In Tooltip ด้วย CSS Animation

    หากต้องการจางในข้อความคำแนะนำเครื่องมือด้วย CSS คุณสามารถลองเรียกใช้โค้ดต่อไปนี้: ตัวอย่าง .mytooltip .mytext { การมองเห็น:ซ่อน; ความกว้าง:140px; พื้นหลังสี:สีฟ้า; สี:#ffff; ดัชนี z:1; ด้านบน:-5px; ขวา:110%; จัดข้อความ:ศูนย์; รัศมีเส้นขอบ:6px; ช่องว่างภายใน:5px 0; ตำแหน่ง:แน่นอน; ความทึบ:0; การเป

  3. สร้างภาพวงกลมด้วย CSS

    ในการสร้างภาพวงกลมด้วย CSS ให้ใช้ border-radius ทรัพย์สิน ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style>          img {             border-radius: 50%;          

  4. สร้างภาพขนาดย่อด้วย CSS

    ในการสร้างภาพขนาดย่อด้วย CSS ให้ใช้ คุณสมบัติเส้นขอบ . ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style>          img {             border: 2px solid orange;         &nbs

  5. คุณสมบัติรีเซ็ตตัวนับ CSS

    หากต้องการสร้างหรือรีเซ็ตตัวนับด้วย CSS ให้ใช้คุณสมบัติการรีเซ็ตตัวนับ คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน การรีเซ็ตตัวนับ ทรัพย์สิน ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style>          body {   &nbs

  6. สร้างข้อความสีขาวที่มีเงาดำโดยใช้ CSS

    ใช้ เงาข้อความ คุณสมบัติสร้างข้อความสีขาวเงาดำ คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้คุณสมบัติ text-shadow: ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style>          h1 {             co

  7. ตั้งค่าคำแนะนำเครื่องมือด้านบนด้วย CSS

    หากต้องการคำแนะนำเครื่องมือ set-top ให้ใช้ ด้านล่าง คุณสมบัติ CSS. คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อตั้งค่าคำแนะนำเครื่องมือเป็นข้อความ: ตัวอย่าง .mytooltip .mytext { การมองเห็น:ซ่อน; ความกว้าง:140px; พื้นหลังสี:สีฟ้า; สี:#ffff; ดัชนี z:1; ด้านล่าง:100%; ซ้าย:60%; ระยะขอบซ้าย:-90px; จัดข้อคว

  8. คุณสมบัติทิศทางภาพเคลื่อนไหว CSS

    ใช้ ทิศทางภาพเคลื่อนไหว คุณสมบัติเพื่อกำหนดว่าควรเล่นภาพเคลื่อนไหวไปข้างหน้า ย้อนกลับ หรือสลับกัน คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน animation-direction คุณสมบัติ: ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style>      

  9. ตั้งชื่อ CSS @keyframes แอนิเมชั่น

    ใช้ ชื่อแอนิเมชั่น คุณสมบัติเพื่อตั้งชื่อของแอนิเมชั่น @keyframes คุณสามารถลองเรียกใช้รหัสต่อไปนี้เพื่อตั้งชื่อแอนิเมชั่น ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style>          div {          

  10. จะเลือกองค์ประกอบที่มีค่าแอตทริบิวต์ที่มีคำที่ระบุด้วย CSS ได้อย่างไร

    ใช้ตัวเลือก [attribute ~=value] เพื่อเลือกองค์ประกอบที่มีค่าแอตทริบิวต์ที่มีคำที่ระบุด้วย CSS คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้ตัวเลือก [attribute ~=value] คำที่เรากำลังค้นหาคือ “บทแนะนำ” ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style&g

  11. สร้างภาพโค้งมนด้วย CSS

    ในการสร้างภาพที่โค้งมนด้วย CSS ให้ใช้ border-radius ทรัพย์สิน ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style>          img {             border-radius: 20px;         &n

  12. เลือกองค์ประกอบทั้งหมดที่มีแอตทริบิวต์ alt ด้วย CSS

    ในการเลือกองค์ประกอบที่มีแอตทริบิวต์ ให้ใช้ตัวเลือก CSS [แอตทริบิวต์] ตัวอย่างเช่น แอตทริบิวต์ alt หรือแอตทริบิวต์เป้าหมาย เป็นต้น คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้ตัวเลือก CSS[attribute] ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style>

  13. ลูกศรทางด้านซ้ายของคำแนะนำเครื่องมือด้วย CSS

    ใช้ขวา คุณสมบัติ CSS เพื่อเพิ่มลูกศรทางด้านขวาของคำแนะนำเครื่องมือ คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อเพิ่มคำแนะนำเครื่องมือที่มีลูกศรไปทางซ้าย ตัวอย่าง .mytooltip .mytext { การมองเห็น:ซ่อน; ความกว้าง:140px; พื้นหลังสี:สีฟ้า; สี:#fff; ดัชนี z:1; ด้านบน:-5px; ซ้าย:110%; จัดข้อความ:ศูนย์; รัศมีเส

  14. เลือกองค์ประกอบ <div> ทั้งหมดและองค์ประกอบ <p> ทั้งหมดที่มี CSS

    หากต้องการจัดรูปแบบ มากกว่าหนึ่งองค์ประกอบ ให้ใช้เครื่องหมายจุลภาค แยกแต่ละองค์ประกอบด้วยเครื่องหมายจุลภาคเพื่อให้บรรลุเป้าหมายนี้ คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อเลือก และ องค์ประกอบ ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style> &nbs

  15. เลือกองค์ประกอบ <p> ทั้งหมดภายในองค์ประกอบ <div> ด้วย CSS

    ใช้ องค์ประกอบองค์ประกอบ ตัวเลือกเพื่อเลือกองค์ประกอบทั้งหมดภายในองค์ประกอบอื่น คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อใช้งาน องค์ประกอบองค์ประกอบ ตัวเลือก ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style>          div p

  16. กำหนดรูปแบบ CSS สำหรับองค์ประกอบเมื่อไม่ได้เล่นแอนิเมชั่น

    ใช้คุณสมบัติ animation-fill-mode เพื่อกำหนดสไตล์สำหรับองค์ประกอบเมื่อไม่ได้เล่นแอนิเมชั่น ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style>          div {             width: 150px;   &

  17. ระบุเส้นโค้งความเร็วของแอนิเมชันด้วย CSS

    ใช้ฟังก์ชั่นการกำหนดเวลาภาพเคลื่อนไหว เพื่อกำหนดเส้นโค้งความเร็วของแอนิเมชั่น คุณสามารถลองเรียกใช้รหัสต่อไปนี้เพื่อให้ได้สิ่งนี้ ตัวอย่าง <!DOCTYPE html> <html>    <head>       <style>          div {        

  18. สร้างคำแนะนำเครื่องมือด้วย CSS

    คำแนะนำเครื่องมือจะปรากฏขึ้นเมื่อผู้ใช้เลื่อนเคอร์เซอร์ของเมาส์ไปที่ข้อความ คุณสามารถเพิ่มข้อมูลเพื่อให้ผู้ใช้เข้าใจได้ง่าย ตัวอย่าง คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อเรียนรู้วิธีสร้างคำแนะนำเครื่องมือ - #mytooltip #mytext { การมองเห็น:ซ่อน; ความกว้าง:100px; พื้นหลัง-สี:สีดำ; สี:#fff; จัดข้อค

  19. สร้างคำแนะนำเครื่องมือที่ปรากฏขึ้นเมื่อผู้ใช้เลื่อนเมาส์ไปเหนือองค์ประกอบด้วย CSS

    คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อสร้างคำแนะนำเครื่องมือที่มองเห็นได้เมื่อวางเมาส์ไว้ ใช้คุณสมบัติการมองเห็น ตัวอย่าง การสาธิตสด #mytooltip #mytext { การมองเห็น:ซ่อน; ความกว้าง:100px; พื้นหลัง-สี:สีดำ; สี:#fff; จัดข้อความ:ศูนย์; รัศมีเส้นขอบ:3px; ช่องว่างภายใน:10px 0; ตำแหน่ง:สัมบูรณ์; ดัชนี z:

Total 1566 -คอมพิวเตอร์  FirstPage PreviousPage NextPage LastPage CurrentPage:45/79  20-คอมพิวเตอร์/Page Goto:1 39 40 41 42 43 44 45 46 47 48 49 50 51