Welcome to Miền ký ức Forum's. Nơi những kỷ niệm vẫn còn sống mãi với thời gian....

»[Share]Chia sẻ hiệu ứng hóa text  Empty»[Share]Chia sẻ hiệu ứng hóa text  Empty

»[Share]Chia sẻ hiệu ứng hóa text

Share

Go downThông điệp [Trang 1 trong tổng số 1 trang]

on 20/10/2010, 8:24 am
Thuan Phong
Thuan Phong


Người sáng lập

Người sáng lập

Cách Trình Bày Trang Web
CSS Giúp đỡ và gợi ý


Tài liệu nầy được phiên dịch từ W3C's Các trang Web mẫu Một vài thủ thuật và lời khuyên trong CSS. Tài liệu nầy có thể có những phiên dịch sai sót. Quí vị có thể tham khảo với bản chính tiếng Anh ở:
http://www.w3.org/Style/Examples/007/text-shadow.html

Bản phiên dịch tiếng Việt:
http://www.300yards.com/007/text-shadow.html Clearwater Homes

Người phiên dịch:
Manh Nguyen
(This page uses CSS style sheets)
Bóng văn bản;
Bóng văn bản mờ:
Văn bản màu trắng có thể đọc được:
Nhiều bóng:
Đường viền ngoài:
NPhát sáng như đèn Nê-ông:
Bóng văn bản

CSS cấp 3 có một đặc tính gọi là bóng chữ (text-shadow) để tạo bóng cho từng chữ cái trong một vài từ. Ở dạng đơn giản nhất, bóng văn bản trông như thế này:h3 {text-shadow: 0.1em 0.1em #333}Thêm màu tối xám (#333) để tạo bóng một chút cho phần bên phải (0.1em) và phần dưới (0.1em) so với văn bản thông thường. Kết quả sẽ như thế này: Các Noak và các Barcicle



(Cho tới tháng 8 năm 2005, không phải tất cả các trình duyệt web đều hỗ trợ đầy đủ chức năng 'text-shadow' tạo bóng văn bản. Phần trên làm việc hiệu quả ít nhất tại Safari và Konqueror.)

Bóng văn bản mờ

Dạng đơn giản nhất của thuộc tính 'text-shadow' bóng văn bản có hai phần: Màu sắc (như #333 ở trên) và phần lề “offset” (như 0.1em 0.1em trong ví dụ trên). Những kết quả này tạo thành một bóng sắc nét ở phần lề được hiển thị. Nhưng phần lề có thể được làm mờ, tạo thành các bóng mờ nhiều hay mờ ít.Độ mờ được tạo ra như một lề khác. Đây là hai dòng, một dòng với độ mờ ít (0.05em) và một dòng chữ với độ mờ nhiều (0.2em):h3.a {text-shadow: 0.1em 0.1em 0.05em #333}h3.b {text-shadow: 0.1em 0.1em 0.2em black} “ “Anh nói gì vậy?” UK nói:

Để nhìn rõ hơn





Chữ trắng có thể đọc được

Bóng có thẻ làm văn bản dễ đọc hơn nếu độ tương phản giữa tiền cảnh và nền sau văn bản nhỏ. Đây là một ví dụ về chữ màu trắng trên nền sau màu xanh nhạt; đầu tiên không tạo bóng và sau được tạo bóng:h3 {color: white}h3.a {color: white; text-shadow: black 0.1em 0.1em 0.2em}Không có bóng:Cái gì ở trong đó dành cho tôi vậy?

Có bóng:Một cái xẻng và vài quả cam





Nhiều bóng:

Bạn cũng có thể tạo nhiều bóng cho văn bản. Nhìn chung, nó nhìn sẽ khá lạ mắt:h3 {text-shadow: 0.2em 0.5em 0.1em #600, -0.3em 0.1em 0.1em #060, 0.4em -0.3em 0.1em #006} Tôi ước ước ước…



Nhưng với các bóng đậm và nhạt khéo xếp đặt, hiệu ứng đạt được có thể sẽ rất hữu ích;h3.a {text-shadow: -1px -1px white, 1px 1px #333}h3.b {text-shadow: 1px 1px white, -1px -1px #333}Tôi, Augustus (anh biết là ai)

Đó là phần thêm, tất nhiên



Việc này hơi nguy hiểm, như bạn có thể thấy nếu trình duyệt của bạn không hỗ trợ chức năng 'text-shadow' tạo bóng văn bản. Thực tế, màu nền sau và màu văn bản trong ví dụ này gần như giống nhau (#CCCCCC và #D1D1D1), do đó nếu không tạo bóng, thì hầu như không có sự tương phản nào.

Vẽ các chữ như có viền ngoài

Một ví dụ hai bóng trong bài trước còn có thể được làm nhiều hơn. Với bốn bóng, các chữ cái có thể tạo thành một đường viền:h3 {text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black}Anh có cảm thấy màu đỏ ?

Một con mèo, một quả táo...vv



Đó không phải là một đường viền hoàn hảo, và trong thời điểm này (tháng 8 năm 2005), các cuộc thảo luận vẫn xoay quanh liệu CSS có nên có một thuộc tính riêng (hoặc có lẽ có một giá trị 'text-decoration' để trang trí văn bản) nhằm tạo các đường viền ngoài tốt hơn.

Phát sáng như đèn Nê-ông

Nếu bạn tạo bóng mờ bên phải phía dưới văn bản, Ví dụ: với phần lề bằng 0, thì sẽ tạo ra hiệu ứng phát sáng bao quanh các chữ. Nếu sự phát sáng của một bóng đơn không đủ mạnh, bạn chỉ việc lặp lại bóng đó vài lần.h3.a {text-shadow: 0 0 0.2em #8F7}h3.b {text-shadow: 0 0 0.2em #F87, 0 0 0.2em #F87}h3.c {text-shadow: 0 0 0.2em #87F, 0 0 0.2em #87F, 0 0 0.2em #87F}Thật là thú vị

Không có phủ định tốt hơn

Quả thục, đúng vậy, Mr M




»[Share]Chia sẻ hiệu ứng hóa text  W3c_home Phạm vi hoạt động Kỹ thuật báo cáo Mục lục Phiên dịch Phần mềm Tiềm kiếm Bên cạnh:Cách thức CSS Giúp đỡ và gợi ý

»[Share]Chia sẻ hiệu ứng hóa text  Mwcts »[Share]Chia sẻ hiệu ứng hóa text  Vcss »[Share]Chia sẻ hiệu ứng hóa text  Vh40 »[Share]Chia sẻ hiệu ứng hóa text  Bert6 Bert Bos
viết ngày 4 tháng 8 năm 2005;
cập nhật lần cuối lúc 12:46:42 $ GMT ngày 03/03/2009


Thông báo tuyển Cộng tác viên trên toàn diễn đàn MKUF, bạn nào có đam mê thì đăng ký nha đừng ngại yeu the »[Share]Chia sẻ hiệu ứng hóa text  90216
»[Share]Chia sẻ hiệu ứng hóa text  Cha-a110
x---------Thời gian qua mới biết không trở lại.---------x
x-------Mất em rồi mới biết tại vì sao.-------x

Xem lý lịch thành viên http://www.phumy2.net

Thích

Báo xấu [0]

Gửi một bình luận lên tường nhà Thuan Phong
Trả lời chủ đề này
on 20/10/2010, 8:26 am
Thuan Phong
Thuan Phong


Người sáng lập

Người sáng lập

Color Name Mã màu
Xem trước
AliceBlue #F0F8FF
AntiqueWhite #FAEBD7
Aqua #00FFFF
Aquamarine #7FFFD4
Azure #F0FFFF
Beige #F5F5DC
Bisque #FFE4C4
Black #000000
BlanchedAlmond #FFEBCD
Blue #0000FF
BlueViolet #8A2BE2
Brown #A52A2A
BurlyWood #DEB887
CadetBlue #5F9EA0
Chartreuse #7FFF00
Chocolate #D2691E
Coral #FF7F50
CornflowerBlue #6495ED
Cornsilk #FFF8DC
Crimson #DC143C
Cyan #00FFFF
DarkBlue #00008B
DarkCyan #008B8B
DarkGoldenRod #B8860B
DarkGray #A9A9A9
DarkGrey #A9A9A9
DarkGreen #006400
DarkKhaki #BDB76B
DarkMagenta #8B008B
DarkOliveGreen #556B2F
Darkorange #FF8C00
DarkOrchid #9932CC
DarkRed #8B0000
DarkSalmon #E9967A
DarkSeaGreen #8FBC8F
DarkSlateBlue #483D8B
DarkSlateGray #2F4F4F
DarkSlateGrey #2F4F4F
DarkTurquoise #00CED1
DarkViolet #9400D3
DeepPink #FF1493
DeepSkyBlue #00BFFF
DimGray #696969
DimGrey #696969
DodgerBlue #1E90FF
FireBrick #B22222
FloralWhite #FFFAF0
ForestGreen #228B22
Fuchsia #FF00FF
Gainsboro #DCDCDC
GhostWhite #F8F8FF
Gold #FFD700
GoldenRod #DAA520
Gray #808080
Grey #808080
Green #008000
GreenYellow #ADFF2F
HoneyDew #F0FFF0
HotPink #FF69B4
IndianRed #CD5C5C
Indigo #4B0082
Ivory #FFFFF0
Khaki #F0E68C
Lavender #E6E6FA
LavenderBlush #FFF0F5
LawnGreen #7CFC00
LemonChiffon #FFFACD
LightBlue #ADD8E6
LightCoral #F08080
LightCyan #E0FFFF
LightGoldenRodYellow #FAFAD2
LightGray #D3D3D3
LightGrey #D3D3D3
LightGreen #90EE90
LightPink #FFB6C1
LightSalmon #FFA07A
LightSeaGreen #20B2AA
LightSkyBlue #87CEFA
LightSlateGray #778899
LightSlateGrey #778899
LightSteelBlue #B0C4DE
LightYellow #FFFFE0
Lime #00FF00
LimeGreen #32CD32
Linen #FAF0E6
Magenta #FF00FF
Maroon #800000
MediumAquaMarine #66CDAA
MediumBlue #0000CD
MediumOrchid #BA55D3
MediumPurple #9370D8
MediumSeaGreen #3CB371
MediumSlateBlue #7B68EE
MediumSpringGreen #00FA9A
MediumTurquoise #48D1CC
MediumVioletRed #C71585
MidnightBlue #191970
MintCream #F5FFFA
MistyRose #FFE4E1
Moccasin #FFE4B5
NavajoWhite #FFDEAD
Navy #000080
OldLace #FDF5E6
Olive #808000
OliveDrab #6B8E23
Orange #FFA500
OrangeRed #FF4500
Orchid #DA70D6
PaleGoldenRod #EEE8AA
PaleGreen #98FB98
PaleTurquoise #AFEEEE
PaleVioletRed #D87093
PapayaWhip #FFEFD5
PeachPuff #FFDAB9
Peru #CD853F
Pink #FFC0CB
Plum #DDA0DD
PowderBlue #B0E0E6
Purple #800080
Red #FF0000
RosyBrown #BC8F8F
RoyalBlue #4169E1
SaddleBrown #8B4513
Salmon #FA8072
SandyBrown #F4A460
SeaGreen #2E8B57
SeaShell #FFF5EE
Sienna #A0522D
Silver #C0C0C0
SkyBlue #87CEEB
SlateBlue #6A5ACD
SlateGray #708090
SlateGrey #708090
Snow #FFFAFA
SpringGreen #00FF7F
SteelBlue #4682B4
Tan #D2B48C
Teal #008080
Thistle #D8BFD8
Tomato #FF6347
Turquoise #40E0D0
Violet #EE82EE
Wheat #F5DEB3
White #FFFFFF
WhiteSmoke #F5F5F5
Yellow #FFFF00
YellowGreen #9ACD32


Thông báo tuyển Cộng tác viên trên toàn diễn đàn MKUF, bạn nào có đam mê thì đăng ký nha đừng ngại yeu the »[Share]Chia sẻ hiệu ứng hóa text  90216
»[Share]Chia sẻ hiệu ứng hóa text  Cha-a110
x---------Thời gian qua mới biết không trở lại.---------x
x-------Mất em rồi mới biết tại vì sao.-------x

Xem lý lịch thành viên http://www.phumy2.net

Thích

Báo xấu [0]

Gửi một bình luận lên tường nhà Thuan Phong
Trả lời chủ đề này
on 20/10/2010, 8:28 am
Thuan Phong
Thuan Phong


Người sáng lập

Người sáng lập

Có nghĩa là kiểu chữ tỏng forum xe biến thành chữ 3d

demo nhé


Enlarge this image Reduce this image Click to see fullsize
»[Share]Chia sẻ hiệu ứng hóa text  634219094214843750
cách để làm 3d hóa cả forum < hiện luôn trong bài viết>
vào css , paste code này vào , vào trên cùng hay dưới cùng cũng ok
Code:body {
text-shadow: 0.5px 0.5px 0 black, 1.5px 1.5px 0 black;
}
trong đó bạn có thể thay 0.5 hoặc 1.5 bằng con số khác , thay black = màu khác
và bạn còn có thể chèn những màu hiệu ưng sau < cái này áp dụng cho toàn thể fourm>
Code:body {text-shadow: 0.1em 0.1em #333}
demo
»[Share]Chia sẻ hiệu ứng hóa text  634219094214843750
tương tự như vậy , các bạn có thể vào web này để tìm code có hiệu ứng
http://www.300yards.com/007/text-shadow.html
và để cho nick admin hay mod có màu chói , hiệu ứng hay chỉ là một đường link dẫn nào có hiệu ứng , bạn dùng code này
Code:
a[href="/profile.forum?mode=viewprofile&u=1"] {text-shadow: 0 0 0.2em #F87, 0 0 0.2em #F87}
Trong đó /profile.forum?mode=viewprofile&u=1 là link dẫn đến người< hoặc đường dẫn > mà bạn muốn có hiệu ứng , {text-shadow: 0 0 0.2em #F87, 0 0 0.2em #F87} là mã code hiệu ứng , bạn có thể thay tùy thích
và bạn muốn hiệu ứng chỗ nào < ví dụ như thanh tiêu đề , hoặc 1 cái gì đó thì chỉ cần lấy mã màu hiệu ứng dán vào
chúc bạn thành công


Nguon: diendan.chinhphuc.info


Thông báo tuyển Cộng tác viên trên toàn diễn đàn MKUF, bạn nào có đam mê thì đăng ký nha đừng ngại yeu the »[Share]Chia sẻ hiệu ứng hóa text  90216
»[Share]Chia sẻ hiệu ứng hóa text  Cha-a110
x---------Thời gian qua mới biết không trở lại.---------x
x-------Mất em rồi mới biết tại vì sao.-------x

Xem lý lịch thành viên http://www.phumy2.net

Thích

Báo xấu [0]

Gửi một bình luận lên tường nhà Thuan Phong
Trả lời chủ đề này

Thích

Báo xấu [0]

Gửi một bình luận lên tường nhà Sponsored content
Trả lời chủ đề này

Về Đầu TrangThông điệp [Trang 1 trong tổng số 1 trang]

»[Share]Chia sẻ hiệu ứng hóa text  Empty»[Share]Chia sẻ hiệu ứng hóa text  Empty

« Xem bài trước | Xem bài kế tiếp »

Bài viết liên quan

    Quyền hạn của bạn:

    Bạn không có quyền trả lời bài viết



    • Create a forum on Forumotion | © PunBB | Free forum support | Liên hệ | Báo cáo lạm dụng | Thảo luận mới nhất
    • Skin SVNH Rip by dothinh Phát triển bởi BQT và tất cả thành viên.
      Chúng tôi không chịu trách nhiệm về các bài viết do thành viên đưa lên.
      Vui lòng ghi rõ nguồn gốc bài viết khi phát hành lại thông tin từ diễn đàn này.

      © FM - Mods by Zzbaivong

     Copyright © wWw.BếnXưa.Vn 2010 - 2020 | Diễn đàn bắt đầu : 16/07/2010 | Liên hệ / Phone 0973210690. | QC :