Thay đổi hình dáng con trỏ chuột trong blogspot bằng CSS

Vào Chủ Nhật, tháng 4 08, 2012 Question | Subscribe | Member | Comments

Blog bạn sẽ trở nên đặc biệt hơn nếu bạn biết cách tạo sự khác biệt. Có rất nhiều cách nhưng thay đổi hình dạng con trỏ chuột thì không phải ai cũng biết để làm. Các này hoàn toàn không khó chỉ cần bạn bỏ ra 2 phút là chuột blog bạn sẽ thay đổi bộ mặt hoàn toàn.

Các bạn xemdemo bằng cách xem con trỏ chuột ở bài viết này nha.
Cách tiến hành:


   1- Đăng nhập vào Blog
   2- Vào thiết kế
   3- Chọn Chỉnh sử HTML (Không cần mở rộng tiện ích mẫu)
   4- Thêm đoạn code sau vào trước thẻ ]]></b:skin> . Ở đây mình giới thiệu cho các bạn 2 dạng.

Dạng 1: Hình ảnh chuột không thay đổi khi dê chuột vào các link.

 Ở dạng này hình ảnh chuột của bạn luôn luôn có định một loại khi bạn dê chuột vào các liên kết trên blog. bạn có thể dùng 1 trong 2 code sau:
Code 1:
body, a, a:hover {cursor:  url(Link trỏ chuột),  progress;} 
Code 2:
HTML,BODY{cursor: url("Link trỏ chuột"), auto;}

- Bạn thay Link trỏ chuột thành link tới các trỏ chuột bạn thích. 

Dạng 2: hình dạng chỏ chuột thay đổi khi dê vào các liên kết.

Các bạn hãy dê chuột vào liên kết này để xem Demo:
- Các bạn sử dụng code sau:
HTML,BODY{cursor: url("Link trot chuột 1"), auto;}
A:hover{cursor: url("Link trỏ chuột 2"), auto;}
- Trong đó
  • Link trỏ chuột 1 là ảnh chuột líc bình thường khi chưa dê vào các liên kết.
  • Link trỏ chuột 2 là hình ảnh chuột khi dê vào liên kết
- Dưới đây mình cung cấp cho các bạn một số hình ảnh về chỏ chuột, Nếu thích ảnh nào thì bạn lấy link để thay vào trên nha.,
Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Icom trỏ chuột: - Truy cập : "http://namkna.blogspot.com/" để lấy các trỏ chuột khác - Kho icom chuột dành cho blogspot Hãy truy cập vào trang "http://namkna.blogspot.com/" để lấy thêm các hình ảnh về tỏ chuột vào xem các thủ thuật thiết kế blog website hữu dụng cho các bạn mới học lập trình webHãy truy cập vào trang "http://namkna.blogspot.com/" để lấy thêm các hình ảnh về tỏ chuột vào xem các thủ thuật thiết kế blog website hữu dụng cho các bạn mới học lập trình webHãy truy cập vào trang "http://namkna.blogspot.com/" để lấy thêm các hình ảnh về tỏ chuột vào xem các thủ thuật thiết kế blog website hữu dụng cho các bạn mới học lập trình webHãy truy cập vào trang "http://namkna.blogspot.com/" để lấy thêm các hình ảnh về tỏ chuột vào xem các thủ thuật thiết kế blog website hữu dụng cho các bạn mới học lập trình webHãy truy cập vào trang "http://namkna.blogspot.com/" để lấy thêm các hình ảnh về tỏ chuột vào xem các thủ thuật thiết kế blog website hữu dụng cho các bạn mới học lập trình webHãy truy cập vào trang http://namkna.blogspot.com/ để lấy thêm các hình ảnh về tỏ chuột vào xem các thủ thuật thiết kế blog website hữu dụng cho các bạn mới học lập trình webHãy truy cập vào trang http://namkna.blogspot.com/ để lấy thêm các hình ảnh về tỏ chuột vào xem các thủ thuật thiết kế blog website hữu dụng cho các bạn mới học lập trình webHãy truy cập vào trang http://namkna.blogspot.com/ để lấy thêm các hình ảnh về tỏ chuột vào xem các thủ thuật thiết kế blog website hữu dụng cho các bạn mới học lập trình webHãy truy cập vào trang http://namkna.blogspot.com/ để lấy thêm các hình ảnh về tỏ chuột vào xem các thủ thuật thiết kế blog website hữu dụng cho các bạn mới học lập trình webHãy truy cập vào trang http://namkna.blogspot.com/ để lấy thêm các hình ảnh về tỏ chuột vào xem các thủ thuật thiết kế blog website hữu dụng cho các bạn mới học lập trình webHãy truy cập vào trang http://namkna.blogspot.com/ để lấy thêm các hình ảnh về tỏ chuột vào xem các thủ thuật thiết kế blog website hữu dụng cho các bạn mới học lập trình webHãy truy cập vào trang http://namkna.blogspot.com/ để lấy thêm các hình ảnh về tỏ chuột vào xem các thủ thuật thiết kế blog website hữu dụng cho các bạn mới học lập trình webHãy truy cập vào trang http://namkna.blogspot.com/ để lấy thêm các hình ảnh về tỏ chuột vào xem các thủ thuật thiết kế blog website hữu dụng cho các bạn mới học lập trình webhttp://namkna.blogspot.com/p/so-o-trang-blog-namkna.html
Chúc thành công!

Có 7 nhận xét & bạn hãy gửi ý kiến của mình!

  1. đã add thành công, cám ơn bạn
    My blog http://gemini360o.blogspot.com/

    Trả lờiXóa
  2. @Mr Ken Không có gì :3) :3) :3)
    - Blog bạn viết về phần mềm hả, vào ban đàu nhìn như blog yahoo 360. :3) :3) :3)

    Trả lờiXóa
  3. Tại sao bài viết này lại có chuột khác bài khác, trong khgi thông thường chuột được áp dụng cho cả blog có phải, người đăng bài đã nhúng code chuột vào phần bài viết và nó chỉ áp dụng cho trang này ?

    Trả lờiXóa
  4. @Thao Trinh Chính xác đoa bạn. Mình chỉ nhúng code vào bài viết này để làm Demo thôi chứ không nhúng vào Templte. do vậy khi xem các bài viết khác bạn không thấy trỏ chuột như thế này đâu.:3) :3) :3)

    Trả lờiXóa
  5. à thì ra bỏ code sau chử "Cách tiến hành"
    đúng blogSpot mới đúng thực sự là mã nguồn mở. người chưa biết hay chơi blog, nhưng để làm chủ thì phải bít code, code nhúng ở đây thường cơ bản, trong khi các mã nguồn khác nói là mở nhưng thực ra là đóng, làm gì cũng tìm modul. tuy nhiên chơi blog lại mất thời gian quá, ko chuyên nghiệp tý nào.

    Trả lờiXóa
  6. @Thao Trinh Uk. Nếu có điều kiện mua cho nó cái tên miền vào thì sẽ rất tốt đó. Lúc đó không rễ để phân biệt blog và web site đâu :3) :3) :3)

    Trả lờiXóa