Wapsite Phong Cách Mới

VG34.
WAPATH.COM

Tạo template.css cho Wapsite

Trước khi bạn mua xe hơi thì bạn đã đi học lái xe, nghĩa là bạn phải sử dụng được xe rồi mới mua xe. Vậy thì bạn cũng nên biết sử dụng Template_css trước khi bạn viết một trình template. Hôm nay VG34 cho các bạn mượn trình Template_css mà VG34 đang sử dụng trên trang http://vg34.xtgem.com . Các bạn có thể click vào khung dưới đây để copy về dán vào tệp template_css và dùng thử.

body { background: #C0C0C0; color: #fff; } a { color: #aaa; font-weight: 700; } a:visited { font-weight: 0; color: #999; } input { border: 1px solid #aaa; background: #555; color: #ccc; } .header { display: block; color: #fff; font-size: 2.3em; text-align: center; width: 100%; } .box { display: block; border: 3px solid #fff; background: #888; color: #fff; text-align: center; } .box2 { display: block; border: 5px solid #000; background: #888; color: #fff; text-align: center; } .box3 { display: block; border: 5px solid #FF0000; background: #888; color: #fff; text-align: center; } .footer { display: block; color: #333; font-size: 0.9em; text-align: center; width: 100%; } .bg1 { background: #676767; display: block; width: 100%; text-align: center; text-indent: 10px; } .bg2 { background: #D2D2D2; color: #666; display: block; width: 100%; text-align: center; text-indent: 10px; } .VG34BLACK { background: #000000; color: #00ffff; display: block; width: 100%; text-align: center; text-indent: 14px; } .VG34RED { background: #FF0000; color: #00FF00; display: block; width: 100%; text-align: center; text-indent: 14px; } .VG34BLUE { background: #4169E1; color: #FFA500; display: block; width: 100%; text-align: center; text-indent: 14px; } .VG34ORANGE { background: #FFA500; color: #FF0000; display: block; width: 100%; text-align: center; text-indent: 14px; } .alternative_text { margin: 4px 0; background: #0757a0; color: #f7f7f9; font-weight: bold; padding: 2px; }

Nếu wap của bạn chưa có trình creator_template.css thì bạn chưa có thể đưa tài liệu này vào được (đưa vào đâu? Chổ đâu mà đưa?). Trường hợp này bạn phải tạo vị trí cho template_css. Bằng cách vào "Bảng" (Panel) và bạn chọn một "mẫu Wapsite" khi hệ thống chuyển đổi xong thì xuất hiện trước mặt bạn danh sách nhiều mẫu wap. Không cần suy nghĩ bạn chọn bất kỳ mẫu nào cũng được vì thực chất bạn không có xài nó đâu. Sau đó bạn bấm OK, hệ thống sẽ trớ về Trình duyệt file.

Tại bảngTrình Duyệt File này bạn hãy tìm một file có tên là creator_template.css đây chính là templat_css mà bạn vừa đăng ký được. Bạn hãy nhập vào file này và xoá toàn bộ nội dung của nó đi. Sau đó dán bản Templat_css của VG34 vào. Như thế là xong. Wapsite của bạn đã được cài trình Templat_css của VG34 rồi đấy.

Hướng Dẩn Sử Dụng templat_css
Bảng templat_css mà các bạn đang có trong wap là một tập hợp mã khung và viền đủ cho bạn thực hiện một trang wap đẹp. Khi xây dựng wap bạn không cần sử dụng mã khung và viền nữa. Không cần viết mã vì nó khó nhớ và chỉ cần sai một từ có khả năng làm mất đi cả một trang hiển thị. Bạn có biết không trang mà bạn đang đọc được xây dựng không có mã nào hết. VG34 đang sử dụng trình Template.css do mình tự viết ra.

Bạn không cần nhập mã khung hay viền để trang trí cho trang wap nữa. Bạn chỉ cần vào phần "Option" và chọn phần "lớp" sẽ thấy xuất hiện nhiều kiểu lớp và bạn tha hồ mà chọn kiểu nào mà bạn thấy thích đó thôi. Thế là bạn đã tạo được những cái khung cho tựa đề bài viết hay tiểu mục nào đó.

Như thế thực hiện trang wap cực kỳ nhanh chóng không cần biết mã là gì. Sau đây mời các bạn xem qua những thí dụ cụ thể của các trường hợp sử dụng template_css.

Sử dụng trình template có khó lắm không?
Hoàn toàn không khó gì cả. Bạn cũng thấy đó: để làm khung cho câu hỏi của bạn vừa rồi (bên trên) tôi chỉ cần đánh câu hỏi và chọn "lớp" Alternative_Text không cần chọn màu chữ không cần chọn màu nền. Trình duyệt VG34 sẽ tự động chọn những thứ đó cho bạn. Nếu ý thích về màu chữ là khắc hơn của hệ thống bạn vẫn có thể bấm vào chữ E và chọn màu chữ theo ý bạn.

Thế thì trong trình template này sẽ có những khung thật ấn tượng không?Câu hỏi vừa rồi của bạn đã được đặt vào khung lớp VG34BLACK một khung ấn tượng vì nó gây sự chú ý. Sự tương phản về màu sắc làm nổi chủ đề đấy! Bạn có thích không?

Không thích đâu. Vì mình là girl mà VG34 chọn màu khác đi. Hãy chọn thủ khung nào có màu sắc không tương phản nhiều ấy.Cũng có những khung với màu sắc có nhẹ nhàng hơn một tí như bạn thấy câu hỏi của bạn bên trên đã được đóng trong lớp VG34BLUE lớp này không mang sự tương phản mạnh. Và còn nhiều kiểu khác nữa.

Thế thì có tất cả bao nhiêu kiểu khung trong lốp vậy?Khung thì khá nhiều kiểu khác nhau. Nếu cần bạn có thể tạo thêm vài chục kiểu trong creator_template.css. Và bạn cũng thấy không cần tiếp xúc với mã nữa VG34 vẫn đóng khung màu được cho các tiểu tựa hay chủ đề.

VG34 có thể giới thiệu cho mọi người xem được không? Hãy giới thiệu tất cả những khung viền hay những kiểu cách nào mà trình template có khả năng thực hiện.Được thôi! Xem này: .....
Text Tester TemplatCSS

Bảng Tester hệ Templat_css

Box
Box2
Box3

Bg1
Bg2
VG34BLACK
VG34BLUE
VG34RED
VG34ORANGE
[Nguyên văn bộ Templat_css của VG34:] body { background: #C0C0C0; color: #fff; } a { color: #aaa; font-weight: 700; } a:visited { font-weight: 0; color: #999; } input { border: 1px solid #aaa; background: #555; color: #ccc; } .header { display: block; color: #fff; font-size: 2.3em; text-align: center; width: 100%; } .box { display: block; border: 3px solid #fff; background: #888; color: #fff; text-align: center; } .box2 { display: block; border: 5px solid #000; background: #888; color: #fff; text-align: center; } .box3 { display: block; border: 5px solid #FF0000; background: #888; color: #fff; text-align: center; } .footer { display: block; color: #333; font-size: 0.9em; text-align: center; width: 100%; } .bg1 { background: #676767; display: block; width: 100%; text-align: center; text-indent: 10px; } .bg2 { background: #D2D2D2; color: #666; display: block; width: 100%; text-align: center; text-indent: 10px; } .VG34BLACK { background: #000000; color: #00ffff; display: block; width: 100%; text-align: center; text-indent: 14px; } .VG34RED { background: #FF0000; color: #00FF00; display: block; width: 100%; text-align: center; text-indent: 14px; } .VG34BLUE { background: #4169E1; color: #FFA500; display: block; width: 100%; text-align: center; text-indent: 14px; } .VG34ORANGE { background: #FFA500; color: #FF0000; display: block; width: 100%; text-align: center; text-indent: 14px; } .alternative_text { margin: 4px 0; background: #0757a0; color: #f7f7f9; font-weight: bold; padding: 2px; }

Vấn đề vẫn còn rất nhiều biết sao mà nói cho hết? VG34 tạm biệt các bạn. Các bạn hãy thường xuyên ghé vào http://vg34.wapath.com các bạn sẽ có nguy cơ trở thành Admin giỏi thứ chó gì cũng biết cả. Và quan trọng hơn là làm wap bằng template.css rất nhanh không xài mã. OK?

Mời xem phần tiếp theo.

VISIT: 343930