Tôi hy vọng bạn sẽ thích bài viết này và nhận được nguồn cảm hứng cần thiết và sự hiểu biết như thế nào phần và các hình thức liên lạc có thể được tạo ra theo cách hấp dẫn, sạch sẽ và sáng tạo.

Chi tiết

Trong bài viết này, chúng tôi sẽ cho bạn thấy một số css sáng tạo và hình thức đăng nhập html mẫu sử dụng thiết kế hiện đại với CSS3 và HTML5. Trong thực tế, hiện nay, dịch vụ, ứng dụng web phổ biến web được cho phép hoặc yêu cầu đăng ký sử dụng, có nghĩa là họ sẽ cần một số loại hình thức cho người dùng đăng ký và đăng nhập trên trang web của họ.

Chi tiết

Ở đây trong bài viết này, chúng tôi đã thu thập được 31 màn hình đăng nhập được thiết kế sáng tạo, do đó bạn sẽ có được cảm hứng để shuffle xung quanh tất cả những yếu tố thông tin đăng nhập và tạo ra một thiết kế độc đáo.

Chi tiết

You should have experienced that a div is being partially or completely covered by a Flash object or Flash movie. No matter how you specifically set the z-index of your DIV to be higher than the Flash movie, it’ll not work on your browsers.

Chi tiết

Contextual Position là một khái niệm rất cơ bản nhưng cũng rất quan trọng trong thiết kế giao diện bằng CSS. Absolute position là một tính năng rất hay của CSS nhưng dường như nó lại rất ít khi được sử dụng và có một số người lại ngại sử dụng Absolute Position. Trong bài này tôi sẽ hướng dẫn bạn cách sử dụng Absolute và chỉ cho bạn thấy khái niệm Contextual Position.

Chi tiết

XHTML (chuẩn mở rộng của HTML) (viết tắt của tiếng Anh Extensible HyperText Markup Language, "Ngôn ngữ Đánh dấu Siêu văn bản Mở rộng") là một ngôn ngữ đánh dấu có cùng các khả năng như HTML, nhưng có cú pháp chặt chẽ hơn và khắc phục được các nhược điểm của ngôn ngữ HTML, đã dần thay thế cho chuẩn HTML

Chi tiết

Các bạn cùng thử xem kiến thức của mình như thế nào rồi nhé

Chi tiết

Mấy tuần trước có một bạn gửi mail cho mình và muốn mình hướng dẫn qua một chút về thiết kế web cơ...

Chi tiết

HTML là thành phần cơ bản nhất để xây dựng lên trang web. Cho dù trang web của bạn có được thiết kế bằng PHP, ASP hay CGI, nhưng nếu muốn hiển thị nội dung lên trình duyệt. Bao giờ output cuối cùng vẫn sẽ là HTML, đây chính là định dạng mà trình duyệt web của bạn có thể đọc được và hiển thị nội dung theo nó.

Chi tiết

Có lẽ liên kết trong HTML và sử dụng hình ảnh là phần mạnh nhất và cũng là thú vị nhất của HTML. Bởi vì trang web là một phức hợp các tài liệu khác nhau được liên hệ với nhau bằng các đường liên kết và được trang trí bằng hình ảnh, màu sắc. Hơn nữa, bằng cách liên kết mà chúng ta có thể liên kết nhiều trang web với nhau và từ đó tạo ra mạng internet. Cũng chính bởi vì tầm quan trọng này của nó mà thẻ link được tách ra trong một video tutorial mới.

Chi tiết

Chắc chắn bạn cũng đang rất háo hức được làm một trang web bằng HTML từ vạch xuất phát đúng không? Bạn không phải đợi lâu!! sau 2 video tutorial hướng dẫn những điều cơ bản về HTML. Trong series gồm 2 phần này, tôi sẽ hướng dẫn bạn cách tạo một trang web bằng HTML hoàn toàn từ đầu. Đây là phần 1 của series và là phần viết code HTML.

Chi tiết

Đây là phần 2 của Series “Tạo trang web bằng HTML”. Trong phần này chúng ta sẽ sử dụng CSS để hoàn thành giao diện đã tạo ở phần trước. Tuy giao diện này không phức tạp, nhưng tôi cũng sử dụng rất nhiều những kỹ năng CSS mà bạn đã học ở những tutorial text trong phần CSS Basic rồi. Nếu có chỗ nào không hiểu, bạn có thể tham khảo lại phần CSS basic.

Chi tiết

Hiện nay Dropdown menu là dạng menu rất phổ biến trên nhiều trang web đặc biệt là những trang web có cấu trúc phức tạp và cần nhiều Categories để hiển thị hết nội dung của trang. Do vậy Dropdown menu là dạng menu lý tưởng để giải quyết vấn đề này. Trước đây nếu muốn có được Dropdown menu bạn cần phải dùng Javascript và cũng hơi rắc rối mới có được menu như ý.

Chi tiết

Menu ba trạng thái là dạng menu khi không có ai click nó một màu, khi người dùng dùng di chuột lên nó, no biến sang trạng thái khác và khi người dùng đang ở một trang, trạng thái liên quan đến trang đó sẽ được hiển thị. Có 2 cách bạn có thể dùng để tạo ra hiệu ứng này. Song với cách được chỉ ra trong video dưới đây sẽ tiết kiệm được tài nguyên máy chủ hơn và cũng nhanh hơn.

Chi tiết

Ở bài trước bạn đã biết rằng tất cả các thành phần xhtml đều có Position Property. Cũng tương tự như vậy tất cả các thành phần xhtml đều có Display Property. Thực tế có khá nhiều giá trị Display Property, nhưng những thành phần hay được sử dụng nhất thường có một giá trị Display Property mặc định là Inline hoặc Block. Video sau đây sẽ minh hoạ cho 2 ví dụ vế sử dụng Display Property kết hợp với Position Property để tạo ra pop up và tool tip

Chi tiết

Ở những bài trước bạn đã học được những kiến thức căn bản về CSS và xHTML. Trong bài này tôi sẽ hướng dẫn bạn cách chuyển một file PSD sang xHTML. Đây cũng là giai đoạn cuối cùng trong cả hành trình học CSS và xHTML của bạn.

Chi tiết

Đây là phần thứ hai trong series gồm 3 phần. Trong phần này tôi sẽ cùng bạn xây dựng code xHTML của trang web. Chúng ta sẽ bắt đầu từ dòng code đầu tiên. Bạn có thể download file html của tutorial này về tham khảo thêm cho rõ ràng. Nhớ là đọc file ReadMe.txt

Chi tiết

Đây là phần 3 và cũng là phần cuối cùng của series tutorial chuyển file PSD thành xHTML. Trong phần trước bạn đã xây dựng xong code HTML và đã validate thành công. Bây giờ tới công đoạn dùng CSS để tạo dang cho giao diện cho giống với mockup trong photoshop.

Chi tiết

Nút giãn nở là dạng nút có thể co gian và bao lấy nội dung khi nội dung của nó to ra hoặc nhỏ lại. Đây là dạng nút được sử dụng rất nhiều làm Tab như trên Izwebz bạn cũng thấy. Nếu chỉ là web tĩnh thì không thành vấn đề, nhưng là web động, đôi khi mình không hoàn toàn điều khiển được nội dung. Ví dụ như bạn muốn thay đổi nội dung của tab từ Home thành My Home Page. Trong Video tutorial này bạn sẽ học được cách tạo nút giãn nở và hover effect của nó luôn

Chi tiết

Clear và Float là một khái niệm rất quan trọng trong CSS và sử dụng rất nhiều trong thiết kế giao diện với CSS. Tôi đã có bài viết về Clear và Float, nhưng vì đây là một khái niệm quan trọng, do vậy tôi muốn làm một video tutorial để giải thích những khía cạnh khác của Clear và Float. Hy vọng qua video này, bạn sẽ hiểu thêm ra về clear và float

Chi tiết

Giống như Drop Down menu Flyout menu cũng được sử dụng rộng rãi trên nhiều trang web. Đặc biệt là những trang web có nhiều nội dung và cần nhiều tầng menu để trình bay hết nội dung. Trong tutorial này, tôi sẽ hướng dẫn bạn c��ch tạo ra flyout menu hoàn toàn bằng CSS.

Chi tiết

Tạo giao diện trong CSS là điều cuối cùng mà bạn muốn làm khi học CSS để hoàn toàn thoát khỏi bảng như những cách thường làm trước đây. CSS cho phép bạn tạo ra rất nhiều loại giao diện khác nhau như 2 cột, 3 cột, cố định, co giãn … Trong video tutorial này, tôi sẽ hướng dẫn bạn cách tạo ra giao diện bằng CSS. Tuy chúng ta sẽ không sử dụng hình ảnh mà chỉ tập trung vào phần chính là các thành phần trong giao diện. Nhưng nó sẽ là khung sường cho những giao diện phức tạp hơn sau này.

Chi tiết

Trong phần trước của tutorial này, tôi đã hướng dẫn bạn cách tạo ra giao diện 2 cột và 3 cột cố định. Trong phần này chúng ta sẽ tạo ra trang web có thể giãn nở tùy theo kích thước của màn hình. Mỗi loại giao diện đều có điểm mạnh và mặt hạn chế khác nhau, do vậy bạn nên quyết định xem dạng giao diện nào phù hợp với trang web của mình nhất.

Chi tiết

Việc biến một giao diện được thiết kế trong Photoshop thành HTML là một phần rất quan trọng trong thiết kế web. Sau này nếu bạn muốn tự tạo giao diện cho trang web của mình cho dù nó động hay là web tĩnh, thì việc chuyển một thiết kế từ PSD sang HTML là việc đầu tiên bạn phải làm. Trong Series tutorial trước, tôi đã hướng dẫn bạn cách chuyển từ PSD sang HTML. Trong lần này, chúng ta sẽ sử dụng một giao diện tương đối phức tạp hơn.

Chi tiết

Đây là phần thứ 2 trong series chuyển file PSD sang HTML. Trong phần thứ nhất, tôi đã hướng dẫn bạn cách cắt hình trong Photoshop và trong phần này, chúng ta sẽ xây dựng code HTML cho giao diện. Phần này hơi chán và buồn tẻ :p, nhưng lại là phần bắt buộc phải làm.

Chi tiết

Đây là phần thứ 3 trong series chuyển file PSD sang HTML. Trong phần thứ hai, chúng ta đã xây dựng xong code HTML cho giao diện. Trong phần 3 này chúng ta sẽ sử dụng CSS để định dạng cho giao diện. Phần này rất dài, 52 phút OMG! cũng khá là nhàm chán nữa. Nhưng nó cũng rất quan trọng. Tôi cũng mất khá nhiều thời gian cho phần này, do vậy hy vọng các bạn thích tutorial này.

Chi tiết

Đến bây giờ bạn đã có một trang web HTML hoàn chỉnh và có thể sử dụng được. Tuy nhiên còn nhiều việc bạn có thể làm để sau này việc quản lý trang web được dễ dàng hơn và tiết kiệm thời gian hơn.

Chi tiết

Z-index là một tính năng khá hay trong CSS và có thể giúp bạn khắc phục nhiều thành phần khó trong thiết kế giao diện và nó cũng có thể tạo ra những hiệu ứng thú vị cho giao diện. Tuy nhiên Z-index nếu không hiểu rõ nguyên lý của nó thì cũng hơi khó sử dụng. Sau khi học xong video tutorial này, bạn có thể tự tin hơn với Z-index

Chi tiết

Div là thẻ rất quan trọng trong thiết kế giao diện. Nó được sử dụng để thay thế hoàn toạn định dạng bảng trước đây. Tuy nhiên khi mới bắt đầu làm việc với CSS, chúng ta có xu hướng lạm dụng thẻ Div. Đôi khi vì muốn tạo được một thành phần nào đó mà bạn có thể sử dụng thẻ div nhiều hơn mức cần thiết. Trong bài này sẽ hướng dẫn bạn cách sử dụng thẻ div đúng cách và “tiết kiệm” nhất.

Chi tiết

Form là cửa ngõ của một trang web, là công cụ duy nhất giúp bạn với người đọc tương tác với nhau cho dù có bằng email, diễn đàn, comments … thì đều là một dạng của form. Trong bài này chúng ta sẽ đi xây dựng một Form bằng HTML và sau đó sẽ dùng CSS để định dạng nó. Chúng ta sẽ không xử lý form này bằng PHP trong tutorial này.

Chi tiết

Lên trên đầu