方法: 1. color 属性を使用して背景色と一致するようにフォントの色を設定します; 2. text-shadow 属性を使用してテキストに影を追加し、凹型フォント効果を実現します。は「text-shadow: -1px - 1px 1px #000, 1px 1px 1px #fff;」です。
このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。
css3 を使用して凹型フォントを実現します
1. color 属性を使用して、テキストの色を背景色と一致するように設定します
2. text-shadow 属性を使用してテキストに影を追加し、凹型フォント効果を実現します。
実装コード:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <style> body { background-color: #ccc; } div { color: #ccc; font: 700 50px "微软雅黑"; } div { text-shadow: -1px -1px 1px #000, 1px 1px 1px #fff; } </style> </head> <body> <div>我是凹下去的文字</div> </body> </html>
(ビデオ共有の学習: CSS ビデオ チュートリアル )
以上がcss3を使用して凹型フォントを実現する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。