3/2/12

Cơ bản Html5 và Css3
Khái niệm
Html 5 và CSS3 là version mới được nâng cấp từ html và Css với nhiều tính năng mới và dĩ nhiên nó là công nghệ của tương lai.
Các tính năng video của HTML5 – cho phép đơn giản hoá việc thêm một video vào trang Web - đã được nhận được nhiều sự chú ý, không những thế HTML5 còn có nhiều tính năng làm nó trở nên tuyệt vời đối với người sử dụng cũng như các nhà phát triển Web.

TML5 sẽ cho phép bạn xem video mà không cần sử dụng một plugin
như Flash hoặc Silverlight.

Vậy thì những gì là lợi ích lớn với tính năng video của HTML5 là gì? Thứ nhất, nó là miễn phí và không cần phần mềm Adobe Flash plugin. Thứ hai, Flash có thể làm chậm máy tính của bạn (mặc dù phần mềm tăng tốc phần cứng hardware-accelerated Flash 10.1 - đang trong phiên bản beta – có thể giúp giải quyết vấn đề này). Sau cùng, nó chỉ là một trong nhiều phần mềm đang chạy và chiếm tài nguyên hệ thống. Với HTML5, tính năng video đã được xây dựng sẵn trong đó.
Một điều quan trọng cần lưu ý về HTML5 video là nó vẫn còn thay đổi. Ví dụ, Safari, Chrome, và sắp tới là Internet Exporer 9 sẽ hỗ trợ HTML5 video sử dụng định dạng H.264. Firefox, mặt khác, hiện thời chỉ hỗ trợ HTML5 video sử dụng định dạng Ogg Vorbis, nhiều người sau khi dùng Firefox cho rằng mã nguồn đóng của H.264 có thể gây ra vấn đề về bản quyền trong tương lai, do đó nó có thể sẽ còn phải thay đổi.
Khả năng tương thích HTML5








- Mặc dù HTML5 và CSS3 vẫn chưa được hoàn tất, nhưng chúng đã làm thay đổi bộ mặt của trang Web. Một số trình duyệt - như các phiên bản hiện hành của Safari và Chrome - đã thực hiện một số tính năng từ các phiên bản dự thảo của HTML5 và CSS3. Và với việc sử dụng những trình duyệt này bạn có thể xem nhiều trang web mà trong đó cũng sử dụng HTML5 và CSS3 như CNN.com, The New York Times, YouTube (trong phiên bản beta).
- Phiên bản hiện tại của Internet Explorer, trình duyệt IE 8, hỗ trợ HTML5 rất hạn chế, tuy nhiên, IE 9 sẽ hỗ trợ H264 video, âm thanh nhúng, đồ họa vector tỷ lệ và CSS3.
- Không kể HTML5 vẫn còn đang trong giai đoạn "thử nghiệm" mà ngay cả một số công nghệ đang được áp dụng cho các trình duyệt và các trang Wed hiện nay vẫn chưa phải là đã kết thúc về mặt kỹ thuật.
- HTML5 và CSS3 – được kết hợp với các công nghệ Web khác như JavaScript - có thể rất hữu ích cho phong cách, định dạng và tốc độ hoạt động của bất kỳ trang web nếu được sử dụng đúng. Hai ngôn ngữ sẽ cách mạng hóa cách chúng ta lập trình và xem internet với các tính năng cải tiến all-in-one, có thể loại bỏ việc phải sử dụng nhiều ứng dụng của bên thứ ba (ví dụ như Flash).
- Trên đây chỉ là một phần nhỏ của những gì mà HTML5 và CSS3 cung cấp. Để tìm hiểu thêm bạn có thể xem thêm các thông tin kỹ thuật chi tiết về HTML5 và CSS3.
- CSS 3 được xây dựng dựa trên các nguồn gốc của các style, selectors và cascade dựa trên phiên bản cũ của CSS 2.0 trước đó. Nó cho phép thực thi thêm 1 số tính năng mới, bao gồm cả mới selectors, pseudo-class và các properties. Bằng cách sử dụng các tính năng mới này, việc thiết kế trình bày template của bạn sẽ trở nên dễ dàng hơn rất nhiều.
Một số thẻ HTML5
Chèn nhạc mp3 thay cho Flash















Chèn video mp4 không cần dùng Flash





















Kiểm tra thuộc tính form bằng html5 không dung Javascript
Kiểm tra email
















Kiểm tra số nhập










Kiểm tra URL














Tham khảo thêm: http://w3schools.com/html5/
Ví dụ CSS3



















Demo
Trước khi đi vào phân tích cấu trúc template demo, các bạn xem hình phân tích cụ thể cấu trúc của trang: