HTML DOM 스타일 textShadow 속성
정의 및 사용
textShadow 속성 집합 또는 하나 이상의 텍스트 그림자 효과를 반환합니다.
문법
textShadow 속성 설정 :
Object.style.textShadow="none|h-shadow v-shadow blur color|inherit"
참고 : textShadow 또는 그림자의 텍스트에 더 추가 속성.이 호텔은 그림자의 쉼표로 구분 된 목록이며, 각 색상에 대한 옵션 값은 2 또는 3 길이 값에 의해 지정됩니다. 제로 기간을 생략한다.
위로 textShadow 속성 :
Object.style.textShadow
值 | 描述 |
---|---|
none | 默认。没有阴影绘制。 |
h-shadow | 必需。水平阴影的位置。可使用负值。 |
v-shadow | 必需。垂直阴影的位置。可使用负值。 |
blur | 可选。模糊距离。 |
color | 可选。阴影的颜色。在 CSS 颜色值 中寻找可能的颜色值的完整列表。 |
inherit | textShadow 属性的值从父元素继承。 |
브라우저 지원
모든 주요 브라우저는 인터넷 익스플로러뿐만 아니라, textShadow 속성을 지원합니다.
예
예
텍스트 그림자를 추가하려면 :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>本教程(w3big.com)</title>
<script>
function displayResult(){
document.getElementById("p1").style.textShadow="5px 5px 1px #ff0000,10px 10px 1px #0000ff";
}
</script>
</head>
<body>
<p id="p1">这是一些文本。</p>
<br>
<button type="button" onclick="displayResult()">添加文本的阴影</button>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>本教程(w3big.com)</title>
<script>
function displayResult(){
document.getElementById("p1").style.textShadow="5px 5px 1px #ff0000,10px 10px 1px #0000ff";
}
</script>
</head>
<body>
<p id="p1">这是一些文本。</p>
<br>
<button type="button" onclick="displayResult()">添加文本的阴影</button>
</body>
</html>
»시도
스타일 개체