Hỗ trợ trực tuyến

  • (Bùi Trọng Bằng)

Thống kê

  • truy cập   (chi tiết)
    trong hôm nay
  • lượt xem
    trong hôm nay
  • thành viên
  • Thành viên trực tuyến

    1 khách và 0 thành viên

    DANH NGÔN MỖI NGÀY

    Gốc > Tìm hiểu code CSS-Java >

    Một số ứng dụng của CSS filter dành cho người mới học.


    Dưới đây là một số cách để thay đổi hình thức TEXT trong trang web của bạn sử dụng CSS. Mình thấy rất nhiều trang web phải chèn những ảnh có kích thước lớn chỉ để có được những TEXT có hiệu ứng nho nhỏ, nếu sử dụng 1 số hiệu ứng lọc sau, bạn có thể giảm thiểu kích thước trang web mà vẫn đẹp:
    Để xem các ví dụ này, bạn mở Notepad ra, copy các đoạn mã trong phần tag <span></span>.. Save lại dưới định dạng HTML rỗi mở ra xem = trình duyệt của bạn. Chú ý, có rất nhiều hiệu ứng khác nữa, các bạn có thể tự tìm tòi (ví dụ như hiệu ứng chữ bốc lửa đang được khá ưa chuộng).

    Màu sáng dần:
    <span style="width: 357; height: 50; font-size: 36pt; font-family: Arial Black; color: red; Filter: Alpha(Opacity=100, FinishOpacity=0, Style=1, StartX=0, StartY=0, FinishX=580, FinishY=0)">Alpha</span>

    Nhoè:
    <span style="width: 357; height: 50; font-size: 36pt; font-family: Arial Black; color: red; Filter: Blur(Add = 1, Direction = 225, Strength = 10)">Blur</span>

    Đổ bóng:
    <span style="width: 357; height: 50; font-size: 36pt; font-family: Arial Black; color: blue; Filter: DropShadow(Color=#FF0000, OffX=2, OffY=2, Positive=1)">Shadow</span>

    Lộn ngược:
    <span style="width: 300; height: 50; font-size: 36pt; font-family: Arial Black; color: red; Filter: FlipV">Flip</span>

    Nền:
    <span style="width: 357; height: 50; font-size: 18pt; font-family: Arial Black; color: red; Filter: Glow(Color=#00FF00, Strength=20)">Glow</span>

    Xám:
    <span style="width: 300; height: 50; font-size: 18pt; font-family: Arial Black; color: red; Filter: Gray">Gray</span>

    MÀu âm bản:
    <span style="width: 387; height: 50; font-size: 18pt; font-family: Arial Black; color: red; Filter: Invert">Invert</span>

    Mặt nạ
    <span style="width: 357; height: 50; font-size: 18pt; font-family: Arial Black; color: red; Filter: Mask(Color=#00FF00)">Mask</span>

    Đổ bóng màu khác
    <span style="width: 357; height: 50; font-size: 18pt; font-family: Arial Black; color: red; Filter: Shadow(Color=#0000FF, Direction=225)">Color Shadow</span>

    Sóng
    <span style="width: 357; height: 50; font-size: 36pt; font-family: Arial Black; color: red; Filter: Wave(Add=0, Freq=2, LightStrength=10, Phase=10, Strength=10)">Wave</span>

    Tia X:
    <span style="width: 300; height: 30; font-size: 18pt; font-family: Arial Black; color: red; Filter: Xray">X ray </span>

    Mặt nạ +bóng+chroma:
    <span style="width: 357; height: 20; font-size: 18pt; font-family: Arial Black; Filter: Mask(color=#FF0000) Shadow(Color=#0000FF, Direction=225) Chroma(color=#FF0000)">The truth of a thing is the feel of it, not the think of it.</span>

    Nhắn tin cho tác giả
    Cao Bằng @ 20:45 18/11/2009
    Số lượt xem: 1909
    Số lượt thích: 0 người
    Avatar

    Một số ứng dụng của CSS  dành cho người mới học.

     
    Gửi ý kiến