Css - Kỹ thuật làm chữ bóng đổ
Thông thường khi chúng ta làm bóng đổ (Shadow) cho chữ chúng ta thường dùng các phần mềm đồ họa như Photoshop, Illustrator, Firework,..vv. Thông thường khi chúng ta làm bóng đổ (Shadow) cho chữ chúng ta thường dùng các phần mềm đồ họa như Photoshop, Illustrator, ...
Thông thường khi chúng ta làm bóng đổ (Shadow) cho chữ chúng ta thường dùng các phần mềm đồ họa như Photoshop, Illustrator, Firework,..vv.
Thông thường khi chúng ta làm bóng đổ (Shadow) cho chữ chúng ta thường dùng các phần mềm đồ họa như Photoshop, Illustrator, Firework,..vv.
Đối với những phần mềm đó thì việc tạo ra bóng đổ cho chữ hết sức đơn giản và có nhiều hiệu ứng bắt mắt, nhưng trong bài viết này tôi xin giới thiệu với các bạn một thủ thuật trongCSSCascading Style Sheets giúp bạn có thể tạo ra hiệu ứng bóng đổ giống như trong các phần mềm đồ họa. Tuy nhiên cách làm này không có nhiều hiệu ứng và kiểu dáng giống như các phẩn phềm đồ họa, nhưng nó vẫn là một cách khá tốt mà chúng ta có thể vận dụng nó để style choWebsiteWebsite và các khái niệm liên quan của mình, sau đây là toàn bộ các bước để thực hiện. Bạn xem minh họa dưới đây
Để tạo ra hiệu ứng cho chữ chúng ta cần tạo ra một trang HTML có nội dung như sau:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>hmweb - Chia sẻ là niềm vui</title>
<style>
#css-shadow
{
margin: 0;
padding: 0;
position: relative; /* Dùng để định vị chữ */
awidth: 500px;
height: 250px;
}
#css-shadow h1.font
{
position: absolute; top: 0; left: 0; z-index: 1;
color: #CC0000;
}
#css-shadow h1.shadow
{
position: absolute; top: 2px; left: 2px; z-index: 0;
color: #C0C0C0;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="css-shadow">
<h1 class="font">hmweb - Chia sẻ là niềm vui</h1>
<h1 class="shadow">hmweb - Chia sẻ là niềm vui</h1>
</div>
</div>
</body>
</html>
Bạn có thể tùy biết nội dung cho phù hợp với yêu cầu hiển thị trên trang của bạn
Chúc bạn thành công
Nguồn: http://www.thietkewebsmart.com/html-css/css-ky-thuat-lam-chu-bong-do/869.htm
Bình luận