Tải bản đầy đủ (.docx) (4 trang)

TU TAO GIAO DIEN VIOLET THEO PHONG CACH RIENG

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (606.11 KB, 4 trang )

<span class='text_page_counter'>(1)</span><div class='page_container' data-page=1>

<b>TỰ TẠO GIAO DIỆN VIOLET THEO PHONG CÁCH RIÊNG</b>


- Thầy Cô đã dùng hết tất cả các mẫu giao diện mà Violet cung cấp và cảm thấy chưa "đã" ???
- Thầy Cô muốn tạo một phong cách riêng cho trang Violet của mình ???


Đây, Bằng Vũ mời Thầy Cô cùng vọc nhé !


<b>Bước 1: Download file nguồn giao diện CSS: </b>GIAO DIỆN TRONG SUỐT hoặc GIAO DIỆN BÌNH
THƯỜNG


<b>Bước 2: Thầy Cơ mở file "GiaodienCSS.doc" (file Word 2003) và thay tên màu vào các vị trí cho phù</b>
hợp. Sau đó COPY đoạn code bên dưới dán vào Notepad và lưu với phần mở rộng là .css. Có thể thay đổi
màu sắc cho từng mục theo ý thích để tạo phong cách riêng bằng 2 cách:


- Dùng tên màu chuẩn bằng tiếng Anh (VD: white, red, blue, green, yellow, brown …)


</div>
<span class='text_page_counter'>(2)</span><div class='page_container' data-page=2>

Khi đã thay màu thích hợp cho từng mục trên giao diện, Thầy Cô lưu file lại và gởi lên
host (BV thấy host này đang ổn định) hoặc host nào có hỗ trợ Java Script (chằng
hạn: ; ) là được.


<b>Bước 3: Chèn link file CSS ấy vào mục “Thông tin bản quyền” bằng đoạn code sau:</b>


Nếu chưa ưng ý, Thầy Cơ có thể chỉnh sửa và upload lên lại, file mới up lên sẽ được ghi đè lên file cũ trên
host. Tại trang Violet, Thầy Cô nhấn F5 để xem sự thay đổi.


<b>Bước 4: Tạo hình ảnh trên tiêu đề khối chức năng:</b>


Với phần này, BV đã ghi link sẵn dẫn đến hình ảnh. Thầy Cơ khơng cần chỉnh sửa link này nếu thích hình
đó.


Hình đây: (Hình gif tự thay đổi màu nền sau mỗi 10 giây)



Nếu khơng thích hình ấy, Thầy Cơ có thể tự tạo cho mình 1 hình khác theo phong cách riêng với kích
thước sau: ngang 190px, cao 42px


<b>Bước 5: Tạo hình ảnh cuối mỗi khung ở khối chức năng:</b>


</div>
<span class='text_page_counter'>(3)</span><div class='page_container' data-page=3>

VD:


<b>Bước 6: Tạo khung nền cho các chuyên mục là tài liệu, tư liệu trên khối chính:</b>
- Gồm 2 khung có kích thước: width 168px x height 150px.


- Thầy Cô dùng phần mềm đồ họa tạo ảnh và ghi chữ độc quyền cuối mỗi khung.
VD:


Khung 1:


Khung 2:


<b>Bước 7: Up các hình trên lên Violet và lấy link thay vào các chỗ BV đã ghi chú ở các dòng đầu trang</b>
trong file CSS.


<b>Bước 8: Upload file đã hoàn chỉnh lên host. Cuối cùng nhấn F5 để refresh lại trang Viole và ngắm nhìn</b>
thành quả.


</div>
<span class='text_page_counter'>(4)</span><div class='page_container' data-page=4>

<b>1) Giao diện trong suốt:</b>


<b>2) Giao diện thường: </b>


TẠO PHONG CÁCH RIÊNG CHO TRANG VIOLET ĐÂY NHÁ !


</div>


<!--links-->
Tạo giao diện vista cho Win xp
  • 14
  • 658
  • 0
  • ×