首页 > 代码库 > box-shadow,text-shadow,前端自定义字体
box-shadow,text-shadow,前端自定义字体
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
@font-face {
font-family: myfamily; /*字体自定义名称，便于引用*/
/*自定义字体
*/
src:url("res/font.TTF");
/*字体的url*/
}
#div1{
width: 200px;
height: 160px;
background-color: darkgray;
/*border-radius: 10px 10px 10px 10px;
/*-webkit-box-shadow: 2 2 voff blur ;*/
/*-moz-box-shadow: 2 hoff voff blur color;*/
box-shadow: 5px 5px 5px blue;
/*水平阴影，垂直阴影，模糊的距离，颜色*/
}
#div2{
width: 160px;
height: 160px;
background-color: darkgray;
border-radius:50%;
}
#p1{
text-shadow: 1px 1px 1px blue;
/*水平阴影，垂直阴影，模糊的距离，颜色*/
font-family: myfamily;
font-size: 20px;
}
</style>
</head>
<body>
<div id="div1">
</div>
<div id="div2">
</div>
<div>
<p id="p1">
this is my text摩登时代几乎是大部分
</p>
</div>
</body>
</html>
本文出自 “matengbing” 博客，请务必保留此出处http://matengbing.blog.51cto.com/11395502/1875853
box-shadow,text-shadow,前端自定义字体