ตวั อยาง Navigation3 <!DOCTYPE html> li a { <html><head><style> display: block; ul { color: #000; list-style-type: none; padding: 8px margin: 0; padding: 0; 16px; width: 200px; text-decoration: background-color: none; #f1f1f1; } }
i a.active { background-color: #4CAF50; color: white; } li a:hover:not(.active) { background-color: #555; color: white; } </style></head>
<body><h2>Vertical Navigation Bar</h2> <p>In this example, we create an \"active\" class with a green background color and a white text. The class is added to the \"Home\" link.</p> <ul> <li><a class=\"active\" href=\"#home\">Home</a></li> <li><a href=\"#news\">News</a></li> <li><a href=\"#contact\">Contact</a></li> <li><a href=\"#about\">About</a></li> </ul></body></html>
ใสเ สนขอบใหกับ Navigation ul { border: 1px solid #555; } li { text-align: center; border-bottom: 1px solid #555; }
Short Hex Code Short Hex Code เปน วธิ กี ารเขียนรหัสสที ีเ่ ปนแบบยอ จากหกหลกั เปนสามหลกั ซง่ึ จะกลายเปน แบบ RGB ทมี่ เี ลขอยา งละตวั เชน รหสั สเี ปน 036 ก็ คือ สแี ดง 0 สเี ขียว 3 สีน้าํ เงนิ 6 ซึ่งในท่นี ี้ กเ็ หมือนกับการเขียน รหัสสีเปน 003366 ดงั ตวั อยางดานลา ง
HTML5 กับการสรางภาพกราฟกโดย W3C <svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"190\"> <polygon points=\"100,10 40,180 190,60 10,60 160,180\" style=\"fill:lime;stroke:purple;stroke- width:5;fill-rule:evenodd;\"> </svg>
ตวั อยา งการใชงาน Canvas <canvas id=\"myCanvas\" width=\"200\" height=\"100” style=\"border:1px solid #d3d3d3;\"> Your browser does not support the HTML5 canvas tag.</canvas> <script> var c=document.getElementById(\"myCanvas\"); var ctx=c.getContext(\"2d\"); // Create gradient var grd=ctx.createLinearGradient(0,0,200,0); grd.addColorStop(0,\"red\"); grd.addColorStop(1,\"white\"); // Fill with gradient ctx.fillStyle=grd; ctx.fillRect(10,10,150,80); </script>
อา งอิง https://www.w3schools.com
Search
Read the Text Version
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109