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...

Quản lý header và footer trong Indesign

Có 3 dạng Header và footer: + Giống nhau ở các trang > Dùng trang đơn + Tiêu đề trang chẵn khác trang lẻ > Dùng trang đôi + Khác nhau theo từng chương > Cần thiết kế nhiều trang Master, mỗi trang định dạng cho 1 chương. Video hướng dẫn thiết kế Header và footer trong Indesign FULL HD chỉ có tại dohoa247 Mọi câu hỏi các bạn có thể comment tại đây hoặc tham gia nhóm: http://fb.com/groups/dohoa247