1. Articles and standards HTML 5.3 - Current HTML5 spec Progressive enhancement The extensible web manifesto Differences between HTML5 and HTML4 from W3C 2. Multimedia capabilities 2.1. Audio Getting started with the Web Audio API Web Audio API at MDN Making a Guitar Tuner with HTML5 Audio visualisation with the Web Audio API and React 2.2. Media Capture Capturing Audio & Video in HTML5 Using the media capture API 2.3. Picture in Picture Chrome's new Picture in Picture API 2.4....
HTML Web Web Design HTML Design
Ngày nay, người dùng truy cập hàng tấn trang web mỗi ngày và các doanh nghiệp phải thể hiện thêm sự sáng tạo để thu hút sự chú ý của họ. Các doanh nhân tập trung vào sự hấp dẫn trực quan và khả năng sử dụng của các giải pháp trên trang web của họ để khiến người dùng ở lại đó. Ngoài ra, họ luôn theo dõi các xu hướng giao diện người dùng mới nhất để duy trì trong trò chơi. Bây giờ...
Web uiux Trends 2021 UI/UX Trends 2021
Đầu tiên, mình sẽ tạo một khung bao bằng svg như sau: <svg width='300' height='200' style='background: cyan'></svg> Tiếp theo, mình sẽ tạo hình tròn bằng circle, với bán kính là 40px: <svg width='300' height='200' style='background: cyan'> <circle r='40' /> </svg> Hình tròn có mặc định màu đen ở góc trên bên trái và tâm đường tròn nằm tại điểm tọa độ x = 0, y = 0. Mình sẽ di chuyển hình vào vị trí...
HTML Web frontend svg circle
Đầu tiên, mình sẽ tạo một khung bao bằng svg như sau: <svg width='300' height='200' style='background: cyan'></svg> Tiếp theo, mình sẽ tạo hình ellipse với bán kính trục tung là 40px và bán kính trục hoành là 80px: <svg width='300' height='200' style='background: cyan'> <ellipse rx='80' ry='40' /> </svg> Hình ellipse có mặc định màu đen ở góc trên bên trái và tâm đường ellipse nằm tại điểm tọa độ x = 0,...
HTML Web frontend svg ellipse
Đầu tiên, mình sẽ tạo một khung bao bằng thẻ <svg> như sau: <svg width='200' height='100' style='background: cyan'></svg> Sau đó, mình sẽ vẽ các đoạn thẳng bằng thẻ <line/>, với điểm kết thúc của đoạn thẳng trước là điểm bắt đầu của đoạn thẳng tiếp theo: <svg width='200' height='100' style='background: cyan'> <line x1='10' y1='5' x2='50' y2='25' stroke='orange' stroke-width='4'...
Animation Web frontend svg LINE
Đầu tiên, mình sẽ tạo một khung bao bằng thẻ svg như sau: <svg width='200' height='200' style='background: cyan'></svg> Tiếp theo, mình sẽ tạo hình đa giác bằng thẻ polygon, với điểm bắt đầu tại điểm x = 65, y = 50 và đi đến các điểm còn lại: <svg width='200' height='200' style='background: cyan'> <polygon points='65,50 135,70 150,150 50,150'/> </svg> Cuối cùng, mình sẽ thêm một số thuộc tính màu...
HTML Web Polygon frontend svg
Khác SVG Polygon sẽ nối tất cả các điểm thành một vòng khép kín. SVG Polyline sẽ không nối điểm đầu và điểm cuối. Đầu tiên, mình sẽ tạo một khung bao bằng thẻ svg như sau: <svg width='200' height='200' style='background: #B71C1C'></svg> Sau đó, mình sẽ vẽ các đoạn thẳng bằng thẻ polyline, với tọa độ bắt đầu là x=20, y=20, bằng cách tạo ra các điểm khác nhau trên hành trình. Lưu ý rằng x...
HTML Animation Web polyline svg
Đầu tiên, mình sẽ tạo một khung bao bằng thẻ svg như sau: <svg width='300' height='200' style='background: #B71C1C'></svg> Tiếp theo, mình sẽ tạo hình ngôi sao bằng thẻ polygon, tại điểm bắt đầu là x = 150, y = 30: <svg width='300' height='200' style='background: #B71C1C'> <polygon points='150,30 105,165' stroke='#FFD600'/> </svg> <svg width='300' height='200' style='background: #B71C1C'> <polygon points='150,30 105,165...
HTML Web frontend svg star
Đầu tiên, mình sẽ tạo một khung bao bằng thẻ svg như sau: <svg width='200' height='200' style='background: #B71C1C'></svg> Sau đó, mình sẽ gõ nội dung hiện thị bên trong thẻ text, với tọa độ x = 50, y = 24 và kích cỡ chữ 24pt như bên dưới: <svg width='200' height='200' style='background: #B71C1C'> <text x='50' y='24' font-size='24pt'>I LOVE SVG</text> </svg> Mình sẽ xoay dòng chữ ở góc 45 độ và tùy chỉnh...
HTML Animation Web svg text
Trọng tâm của hướng dẫn này, mình sẽ đưa bạn để cách làm dễ nhất và có thể bắt tay vào làm ngay. Do đó, mình không cố để viết một bài chi tiết hay nặng về lý thuyết. Bạn có thể tìm hiểu sâu thêm từ internet. Trước khi đi vào bài viết, mình có để lại link bài viết về cách tạo SVG được sử dụng trong bài viết này. https://naututs.com/svg-rectangle/ Mình sử dụng Codepen để demo các...
Animation Web frontend rectangle GSAP
Trọng tâm của hướng dẫn này, mình sẽ đưa bạn để cách làm dễ nhất và có thể bắt tay vào làm ngay. Do đó, mình không cố để viết một bài chi tiết hay nặng về lý thuyết. Bạn có thể tìm hiểu sâu thêm từ internet. Trước khi đi vào bài viết, mình có để lại link bài viết về cách tạo SVG được sử dụng trong bài viết này. https://naututs.com/svg-circle/ Mình sử dụng Codepen để demo các...
Animation Web frontend circle GSAP
Đầu tiên, mình sẽ tạo một khung bao bằng thẻ svg như sau: <svg width="200" height="200" style="background: #B71C1C"></svg> Sau đó, mình sẽ tạo các đường kẻ bằng thẻ path, lưu ý là M xuất hiện ở tọa độ điểm đầu tiên: <svg width="200" height="200" style="background: #B71C1C"> <path stroke='white' d='M20,20 180,20'/> <path stroke='white' stroke-width='2' d='M20,40 180,40'/> <path stroke='white' stroke-width='3'...
HTML Web frontend svg stroke
Trình duyệt web có thể hiểu khái quát là công cụ giúp bạn tìm kiếm để giải đáp những thắc mắc của bản thân. Tuy nhiên không phải ai cũng thực sự hiểu về trình duyệt web là gì cũng như những công dụng và các loại trình duyệt đang được ưa chuộng sử dụng ngày nay. Trình duyệt web là gì? Trình duyệt web còn gọi là trình duyệt, hay công cụ tìm kiếm là một ứng dụng được tạo ra nhằm...
Web cách học lập trình cho người mới bắt đầu chia sẻ học lập trình websie