DIV CSS3 텍스트 그림자 글꼴 그림자(코드 예)-CSS 튜토리얼-php.cn

DIV CSS3 텍스트 그림자 글꼴 그림자(코드 예)

云罗郡主

풀어 주다： 2018-10-16 14:21:03

앞으로

2346명이 탐색했습니다.

이 기사의 내용은 DIV CSS3 텍스트 그림자 글꼴 그림자(코드 예제)에 대한 것입니다. 필요한 친구들이 참고할 수 있기를 바랍니다.

1. CSS3 단어 및 구문

1. CSS3 단어:
text-shadow

2. 구문 구조

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

로그인 후 복사

p 상자의 텍스트 그림자 효과를 왼쪽에서 5px, 위쪽에서 2px로 설정합니다. 동시에 그림자 효과 표시를 시작합니다. 그림자 크기 범위는 6px이고 그림자 색상은 검정색(#000)입니다.

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 중국어 웹사이트에 주목해주세요.

위 내용은 DIV CSS3 텍스트 그림자 글꼴 그림자(코드 예)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!