Day la mot link
Ngoài ra, để thiết lập trạng thái khác cho link, bạn sử dụng thuộc tính: • Trạng thái :link – biểu thị trang web trình duyệt chưa lưu (tức người sử dụng lần click vào đường dẫn này) • Trạng thái :visited – biểu thị đường dẫn tới trang web lưu trình duyệt (tức người sử dụng click vào đường dẫn trước rồi) • Trạng thái :hover – biểu thị người sử dụng di chuyển chuột qua phần tử mà chứa link (tức phần tử link người sử dụng di chuyển chuột qua phần tử đó) • Trạng thái :active – biểu thị đường link active người sử dụng click chuột vào Ghi chú: Trạng thái :hover PHẢI theo sau trạng thái :link :visited định nghĩa CSS có hoạt động Nếu thiếu hai trạng thái trên, Style Rule bạn định nghĩa cho :hover khơng có giá trị Trạng thái :active PHẢI theo sau trạng thái :hover định nghĩa CSS Ví dụ http://vietjack.com/ Trang chia sẻ các bài học online miễn phí http://vietjack.com/css/index.jsp Copyright © vietjack.com #006600} a:link {color: #000000} a:hover {color: #FFCC00} a:visited {color: a:active {color: #FF00CC} Tiếp theo, tìm hiểu cách sử dụng thuộc tính để tạo hiệu ứng khác cho đường link CSS Thiết lập màu cho Link CSS Để thiết lập màu cho Link, bạn sử dụng thuộc tính color CSS Như trình bày chương Màu CSS, giá trị thuộc tính color tên màu giá trị Hex Code, … a:link {color:#000000} Click vao link nay Kết là: Thiết lập màu cho Visited Link CSS Trạng thái :visited đường link lưu trình duyệt Để thiết lập màu cho loại đường này, bạn theo dõi ví dụ sau: #006600} nay a:visited {color: Click vao link Khi bạn click vào đường link này, màu link chuyển sang màu xanh Thay đổi màu cho Link Di chuyển chuột qua Với trường hợp này, bạn sử dụng trạng thái :hover Nên ghi nhớ rằng, phần định nghĩa CSS, để đường Link hoạt động, bạn nên đặt trạng thái sau hai trạng thái :link :visited Tuy nhiên, đơn giản ví dụ sau thực sau: #FFCC00} nay a:hover {color: Click vao link Khi bạn di chuyển chuột qua đường link trên, màu link chuyển sang màu vàng http://vietjack.com/ Trang chia sẻ các bài học online miễn phí http://vietjack.com/css/index.jsp Copyright © vietjack.com Thay đổi màu cho Actived Link CSS Để biểu thị link active, bạn thay đổi màu link sang màu khác chẳng hạn Để thiết lập trạng thái này, bạn sử dụng :active CSS Ví dụ sau minh họa cách thay đổi màu cho Actived Link sử dụng thuộc tính color CSS #FF00CC} nay a:active {color: Click vao link Khi bạn click chuột vào link này, màu link chuyển sang màu hồng Kết là: Sử dụng thuộc tính text-decoration với Link CSS Nếu bạn để ý ví dụ trên, bạn thấy đường link có dấu gạch chân bên Vậy làm cách để làm biến dấu gạch chân cho đường link, bạn sử dụng thuộc tính text-decoration với giá trị none (Bạn tham khảo chương Text CSS để có giá trị cho thuộc tính này) Ví dụ a:link { text-decoration: none; } a:visited { text-decoration: none; } a:hover { text-decoration: underline; } a:active { text-decoration: underline; }This is a link
Note: a:hover MUST come after a:link and a:visited in the CSS definition in order to be effective.
Note: a:active MUST come after a:hover in the CSS definition in order to be effective.
Thiết lập màu cho Link CSS Để thiết lập màu cho Link, bạn sử dụng thuộc tính background-color CSS Để tìm hiểu giá trị thuộc tính này, bạn tham khảo chương Color CSS Ví dụ a:link { background-color: yellow; } a:visited { background-color: cyan; } a:hover { background-color: lightgreen; } a:active { background-color: hotpink; }This is a link
Note: a:hover MUST come after a:link and a:visited in the CSS definition in order to be effective.
Note: a:active MUST come after a:hover in the CSS definition in order to be effective.
http://vietjack.com/ Trang chia sẻ các bài học online miễn phí http://vietjack.com/css/index.jsp Copyright © vietjack.com Ngồi ra, bạn kết hợp nhiều thuộc tính khác CSS để làm cho Link bạn giống Box, Button Sử dụng ví dụ trên, bạn cần thay Style Rule: a:link, a:visited { background-color: #f44336; color: white; padding: 14px 25px; text-align: center; text-decoration: none; display: inline-block; } a:hover, a:active { background-color: red; } http://vietjack.com/ Trang chia sẻ các bài học online miễn phí ... tính để tạo hiệu ứng khác cho đường link CSS Thiết lập màu cho Link CSS Để thiết lập màu cho Link, bạn sử dụng thuộc tính color CSS Như trình bày chương Màu CSS, giá trị thuộc tính color tên màu... a :link {color:#000000} Click vao link nay Kết là: Thiết lập màu cho Visited Link CSS Trạng thái :visited đường link lưu trình duyệt Để thiết... màu cho Link CSS Để thiết lập màu cho Link, bạn sử dụng thuộc tính background-color CSS Để tìm hiểu giá trị thuộc tính này, bạn tham khảo chương Color CSS Ví dụ a :link {