首页 > 代码库 > CSS3自定义字体.
CSS3自定义字体.
终于看完了<响应式WEB设计:HTML5+CSS3实战>这个书啦,那个高兴.
看完后学了一些东西,在这里记一下如何用CSS3实现自定义的字体效果.
首先去下载些自己想要的字体,放在文件目录下面.
1:在Css中用@font-face定义字体
1 @font-face{2 font-family:‘myfont‘; //你想给你的自定义的文字起一个什么样的名称[请自便]3 src:url(./yizhuifangxiu.ttf);//你自定义文字文件的路径4 font-weight:700;5 font-style:normal;6 }
以上的定义后就可以在其他的标签中使用我们自定义的字体了.
例如我在一个DIV中的文字实现自定义字体的效果如下:
div{ /* 应用字体样式 */ font-family:‘myfont‘; font-size:80px; /* 制作文字阴影效果 */ text-shadow:-1px -1px 2px white, -2px -2px 2px white, -3px -3px 2px white, -4px -4px 2px white, -5px -5px 2px white, 1px -1px 2px white, 2px -2px 2px white, 3px -3px 2px white, 4px -4px 2px white, 5px -5px 2px white, 0px 01px 2px white, 0px 02px 2px white, 0px 03px 2px white, 0px 04px 2px white, 0px 05px 2px white; }
HTML代码
1 <body>2 <div>Hello World</div>3 </body>
最后的效果显示(灰常漂亮啊)
CSS3自定义字体.
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。