开发者学堂课程【HTML5 新特性学习:文本效果】学习笔记,与课程紧密联系,让用户快速学习知识。
课程地址:https://developer.aliyun.com/learning/course/396/detail/5055
文本效果
CSS3包含多个新的文本特性
属性:
text-shadow
word-wrap
浏览器支持:
Internet Explorer 10、Firefox、 Chrome、 Safari 以及Opera支持text-shadow属性。
1、阴影效果
<style>
h1{
text-shadow: 10px 10px 5px #f f0000;
]
</ style>
I </head>
<body>
<h1>我是- -个标题</h1>
2、文本常用使用方式
<style>
p. testf
width:Ị1em;
border: 1px solid aqua;
word-wrap: b reak-word ;
]
</style>
/head>
<body>
<p class="test">
this is my web pagethis is my web pagethis is my web pagethis
this is my web pagethis is my web pagethis is my web pagethis
this is my web pagethis is my web pagethis is my web pagethis is my web pagethis
</p>
3、使用字体方式
<style>
@font-face f
font- -family: myfamily;
src: url("") ;
sre: url("");l
)
div(
font- -family: myfamily;
]
/style>
i </head>
<body>
<div>
hello hello hello hello hello hello hello hello hello
</div>