Chuyển đến nội dung chính

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:


Nhận xét

Bài đăng phổ biến từ blog này

Phím tắt trong Autodesk Maya

Công cụ xem tài liệu Alt + Click trái chuột kéo > Xoay vùng nhìn Alt + Click phải chuột kéo > Phóng to | thu nhỏ màn hình Alt + Click phím giữa chuột di chuyển > Di chuyển vùng nhìn Xoay phím giửa chuột > Phóng to, thu nhỏ vùng nhìn [, ] > phóng to, thu nhỏ f > Zoom selection A > Xem tất cả các đối tượng 4 > WireFrame | Khung dây 5 > Smooth shape all | Xem ảnh trơn 6 > Kết hợp Wireframe & Smooth Công cụ Transform W > Move tool E > Xoay hình R > Thay đổ kích thước Ctrl + A > Chọn bảng Channel box Ctrl + G > Dời tâm về góc tọa độ Window / Outline > Chọn đối tượng theo tên Space > Hotbox: chọn các lệnh nhanh F8 > Chuyển đổi từ chế độ Object sang Component (Chỉnh Object hoặc từng điểm hay đoạn, mặt,…) Thuộc tính công cụ chọn Double click vào công cụ chọn bất kỳ ...

Phím tắt của Cinema 4D

Tool E: Move tool > Công cụ duy chuyển đối tượng R: Rotate tool > Công cụ xoay đối tượng T: Scale tool > Công cụ chỉnh kích thước đối tượng Phím Space: Đổi qua lại công cụ hiện hành và Selection tool Click chuột giữa: Hiển thị 4 khung nhìn F5 | Click chuột giữa: Hiển thị 4 khung nhìn Phím số 1+ Click chuột | Alt+Chuột giữa: dời khung nhìn Phím số 2 + Click chuột | Lăng chuột giữa: Phóng to, thu nhỏ Phím số 3+ Click trái chuột | Alt+ Chuột trái: Xoay khung nhìn Chuyển khung nhìn F1: Chuyển sang vùng nhìn Perspective F2: Chuyển sang vùng nhìn Top F3: Chuyển sang vùng nhìn Right F4: Chuyển sang vùng nhìn Front F5: Xem 4 vùng nhình Ctrl + E: Edit / Preference F6 | F8: Play Ctrl + B: Render Setting F | G: Prev Frame, Next Frame B: Brige Nối các điểm hoặc cạnh Tool E: Move tool > Công cụ duy chuyển đối tượng R: Rotate tool > Công cụ xoay đối tượng T: Scale tool > Công cụ chỉnh kích thước đối tượng Phím Space: Đổi qua lại công cụ hiện hành và Selection tool S | O: Zoom to Se...

Download bài tập thực hành

Download bài tập thực hành Đang cập nhật.... Bài tập photoshop Lab1. Bài tập Illustrator Lab1 Bài kiểm tra Bài tập Corel Lab1 Bài tập Indesign / QuarkXPress Lab1 Lab6. Định dạng Header & footer Download source Lab7.Thiết kế Catalogue Download bài tập dàn trang Lab8. book Download   Kiểm tra QuarkXPress >Download Bài tập Đồ họa web bt_photoshop > Download Layout Shop_Hoatuoi > Download Layout_Laptop > Download CSS_CB > Download Form > Download Jquery_CB > Download Bài tập Flash Lab1 Bài tập Web doanh nghiệp Lab1 Link tham khảo http://nhatnghe.com/forum - Forum nhất nghệ http://thongbao.webdoanhnghiep.org - Tài liệu học web doanh nghiệp, đồ họa web, joomla http://w3schools.com - học web cơ bản http://dynamicdrive.com - Mã nguồn mở cho web (menu, css, javascript, tooltip, ajax,...) miễn phí. http://templatemonster.com - Template mẫu cho web. Database webtintuc: http://www.mediafire.com/?yb0y40h9mbun2vb Test dohoaweb: http://www.mediafire.com/?nd28...