welcome tinhocK1 website

Thursday, 28/03/2024, 7:15 PM

Chào Guest

Login form

Đăng nhập:
mật khẩu:

Ẩn

Tán Gẫu

500

Bạn thấy web tinhoc K1 thế nào?

Rate my site
Total of answers: 108
[ New messages · Members · Forum rules · Search · RSS ]
  • Page 1 of 1
  • 1
Forum moderator: chicken_design  
Forum » cộng nghệ thông tin » thiết kế web » thiết kế web bằng DW MX p5
thiết kế web bằng DW MX p5
quocdat11 Date: Wednesday, 27/08/2008, 3:21 PM | Message # 1
Nhóm: Removed





Giới thiệu về Cascading Style Sheet (CSS):

CSS là 1 là 1 tập hợp các định dạng về nhiều mặt như font, cỡ chữ, màu sắc, vị trí của object… giúp cho bạn có 1 khuôn mẫu trong thiết kế làm cho website của bạn có tính nhất quán.
CSS giúp bạn có thể làm được những chuyện mà HTML đơn thuần 0 làm được.
CSS có thể sử dụng cho nhiều loại đối tượng như table, layout cell, text…
DW còn hỗ trợ 1 loại style sheet khác là HTML style sheet nhưng không mạnh bằng CSS do đó tôi chỉ giới thiệu về CSS.
Để tạo 1 CSS, bạn có thể làm như sau:
+ Menu bar --} Text --} CSS Styles --} New CSS Style.
+ Bấm tổ hợp phím Shift+F11 để mở cửa sổ CSS Style. Sau đó bạn click vào button New CSS Style(ở phía dưới cửa sổ CSS Style).
+ Name: bạn điền vào tên của CSS. Bạn đặt tên sao cho dễ nhớ và gợi tả. VD như CSS tên là Fontstyle dùng để xác định các thuộc tính về font chữ.
+ Type: bạn thấy có 3 radio button để lựa chọn:
Make custom style: Tạo 1 CSS mới.
Redefine HTML tag: Định nghĩa lại 1 HTML tag. Theo tôi thì bạn đừng nên thay đổi các tag HTML.
Use CSS Selector: Tạo CSS giành cho link (hypertext)trong trang web.
Cả 3 lựa chọn đều có cách làm việc như nhau nên tôi chỉ hướng dẫn các bạn tạo custom style .
+ Define in: có 2 sự lựa chọn: Nếu bạn chọn This document only thì CSS tạo ra sẽ chỉ được áp dụng cho trang web(chứ không phải website) bạn đang thiết kế. Lựa chọn còn lại để giành cho bạn tạo 1 CSS riêng biệt và lưu thành 1 file. Do đó bạn có thể sử dụng CSS đó cho nhiều trang khác nhau.

Sau khi chọn Type là Custom Style và Define in New Style Sheet File, bạn click vào OK thì 1 cửa sổ Save As sẽ xuất hiện để bạn nhập vào file name. Theo tôi thì file name nên trùng với CSS name để tránh nhầm lẫn.
Bạn sẽ thấy cửa sổ mới có 2 phần chính như sau:
phần Category bao gồm các Item như Type, Background… và phần còn lại kế bên bao gồm chi tiết của từng nhóm Category được chọn.

Nhóm Type:

+ Font: Xác định họ font chữ của style sheet.
+ Size: Xác định cỡ chữ của văn bản. Bạn sẽ thấy có 2 drop down box tại thuộc tính này. Drop down box đầu tiên để bạn lựa chọn/ điền vào 1 giá trị nào đó. Có 2 loại giá trị là giá trị tuyệt đối( VD như 1,2,13…) và giá trị tương đối ( large, small, medium…) , theo tôi thì bạn nên chọn giá trị tương đối vì tuỳ theo độ phân giải của máy người dùng mà web browser sẽ chọn size thích hợp. Drop down box thứ 2 để bạn chọn đơn vị đo. Mặc định là pixels, và bạn cũng nên giữ nguyên giá trị mặc định này.
+ Style: Dạng của chữ. Có 3 giá trị là normal. Italic và Oblique. Giá trị normal là mặc định. Còn Italic và Oblique dùng để làm cho văn bản có dạng chữ nghiêng.
+ Line Height: Chiều cao của dòng văn bản.Có 2 drop down box tương tự như thuộc tính Size.
+ Decoration: Tại thuộc tính này bạn sẽ thấy có các check box để chọn, bạn có thể chọn 1/nhiều hoặc 0 chọn giá trị nào đều được. Underline dùng để gạch dưới văn bản, overline dùng để gạch trên văn bản, linethrough dùng để gạch xuyên qua văn bản, blink dùng để tạo cho văn bản nhấp nháy ( mặc dù có dùng thì văn bản của bạn cũng không nhấp nháy đâu , chắc là chưa được hỗ trợ) và cuối cùng là None.
+ Weight: Độ đậm của nét chữ. Cũng có giá trị tương đối và tuyệt đối.
+ Variant: Chỉ được hỗ trợ trong IE và 0 hỗ trợ trong Nescape Navigator. Có 2 giá trị là normal và small-caps. Giá trị small-caps dùng để định dạng đoạn văn bản có thuộc tính in hoa nhỏ. Bạn sẽ 0 thấy được sự thay đổi trong Document window, khi bấm F12 thì bạn sẽ biết ngay mà )
+ Case: Có 4 giá trị là Capitlalize, Uppercase, Lowercase và none. Thuộc tính Capitalize làm cho Ký tự đầu tiên của mỗi từ được in hoa. Uppercase làm cho cả đoạn văn bản in hoa, Lowercase làm cho cả văn đoạn văn bản in thường. Còn none giữ nguyên những gì mà bạn nhập vào.
+ Color: Màu của chữ.
Nhóm Background:
+ Background Color: màu nền của đối tượng. Thường là 1 table hoặc cả trang web.
+ Backgroung Image: Đường dẫn đến ảnh nền của đối tượng. Tương tự như background image.
+ Repeat: Thuộc tính này xác định cách thức ảnh nền lặp lại trong trang web.Chỉ có giá trị nếu bạn dùng những ảnh nền nhỏ hơn trang web của bạn. Điều này cũng giống như bạn lót gạch cho nền nhà mà sàn nhà chính là trang web còn những viên gạch là ảnh nền . Các giá trị trong thuộc tính repeat:
No repeat: 0 lặp lại. Điều này cũng giống như bạn chỉ lót 1 viên gạch cho cả 1 nền nhà rộng thênh thang vậy.
Repeat: hình nền được lặp lại sao cho che phủ hết toàn trang web.
Repeat-x: Chỉ lặp lại theo chiều ngang.
Repeat-y: Chỉ lặp lại theo chiều dọc.
Attachment, Horizontal Position(HP) và Vertical Position(VP): Chỉ được hỗ trợ trong IE, không hỗ trợ trong Nescape Navigator. 3 thuộc tính này có liên quan đến nhau. Nếu bạn chọn giá trị của thuộc tính Attachment là Fixed thì 2 thuộc tính kia sẽ canh (trái, phải, giữa…) vị trí của hình nền theo Document window. Còn nếu bạn chọn giá trị của thuộc tính Attachment là Scroll thì vị trí của hình nền sẽ được canh theo đối tượng. VD như bạn chọn Attachment là Fixed, HP là center và VP là bottom thì hình nền sẽ được canh giữa theo chiều ngang và canh dưới theo chiều cao trong trang web. 1 VD nữa, tương tự như trên nhưng bạn chọn Attachment là Scroll và CSS này được sử dụng cho table thì hình nền sẽ được canh đối với table chứ 0 phải đối với toàn trang web.

 
Forum » cộng nghệ thông tin » thiết kế web » thiết kế web bằng DW MX p5
  • Page 1 of 1
  • 1
Search: