DIV CSS3 テキストシャドウフォントシャドウ (コード例)-CSSチュートリアル-php.cn

DIV CSS3 テキストシャドウフォントシャドウ (コード例)

云罗郡主

リリース： 2018-10-16 14:21:03

転載

2323 人が閲覧しました

この記事は DIV CSS3 のテキストシャドウフォントシャドウに関するものです。必要な方は参考にしていただければ幸いです。が手伝う。

1. CSS3 の単語と文法

1. CSS3 の単語:
text-shadow

2. 文法構造

p{text-shadow:5px 2px 6px #000;}

ログイン後にコピー

p ボックスでテキストの影効果を設定すると、左から 5 ピクセル、上から 2 ピクセルの位置で影の効果が表示されます。同時に、影のサイズ範囲は 6 ピクセル、影の色は黒 (#000) になります。

3. 説明
テキスト表示の影効果には合計 4 つの値があり、最初の値は影効果の表示を開始する左からの距離を表します。影効果の表示を開始する左からの距離、3 番目の値は影効果の表示を開始する左からの距離を表し、最初の値は影の範囲のサイズを表し、4 番目の値は影効果の色を表します。

2. ケース

1. ケース HTML コード

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>字体阴影 在线演示 DIVCSS5</title> 
<link href="images/style.css" rel="stylesheet" type="text/css" /> 
<!-- www.divcss5.com --> 
</head> 
<body> 
<div>我阴影文字</div> 
<div class="txt">文字阴影测试内容1</div> 
<div class="txt2">文字阴影测试内容2</div> 
</body> 
</html>

ログイン後にコピー

2. 対応する CSS コード:

.txt {text-shadow:5px 1px 6px #F93 }  
.txt2 {text-shadow:1px 1px 1px #000; padding:10px 0; color:#FFF; background:#CCC}

ログイン後にコピー

上記は DIV CSS3 テキストシャドウフォントです。シャドウ (コード例) の完全な紹介。CSS3 ビデオチュートリアル について詳しく知りたい場合は、PHP 中国語 Web サイトに注目してください。

以上がDIV CSS3 テキストシャドウフォントシャドウ (コード例)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

DIV CSS3 テキストシャドウ フォントシャドウ (コード例)

1. CSS3 の単語と文法

2. ケース

DIV CSS3 テキストシャドウフォントシャドウ (コード例)