• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >css3 > CSS3制作炫酷的自定义发光文字

CSS3制作炫酷的自定义发光文字

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-06-02

本文主要包含css3自定义滚动条,css3自定义字体,css3自定义动画,css3背景图片自适应,css3图片自适应等相关知识,佚名 希望在学习及工作中可以帮助到您

本文为大家分享一款基于纯CSS3的文字发光特效,当我们将鼠标滑过文字时,文字就会模拟发光动画,展现出非常酷的发光画面。另外,由于引用了特殊字体,所以整个文字效果看起来有着3D立体的特效,如果你的网络无法加载这些字体,可能是由于国外的这个网站被墙的缘故,就像google的字体库网址被屏蔽那样。

HTML代码

</div>
  1. <div id="container">  
  2.   
  3.   <p><a href="#">  
  4.     RED   
  5.   </a></p>  
  6.   
  7.   <p><a href="#">  
  8.     BLUE   
  9.   </a></p>  
  10.   
  11.   <p><a href="#">  
  12.     Yellow   
  13.   </a></p>  
  14.   
  15.   <p><a href="#">  
  16.     GREEN   
  17.   </a></p>  
  18.   
  19.   <p><a href="#">  
  20.     ORANGE   
  21.   </a></p>  
  22.   
  23.   <p><a href="#">  
  24.     VIOLET   
  25.   </a></p>  
  26.   
  27. </div>  
  28.   
</div> </div>

CSS代码

</div>
  1. /*setup*/  
  2. *{   
  3.   margin: 0;   
  4.   padding: 0;   
  5. }   
  6.   
  7. @font-face {   
  8.   font-family: 'Monoton';   
  9.   font-style: normal;   
  10.   font-weight: 400;   
  11.   src: local('Monoton'), local('Monoton-Regular'), url(http://themes.googleusercontent.com/static/fonts/monoton/v4/AKI-lyzyNHXByGHeOcds_w.woff) format('woff');   
  12. }   
  13.   
  14. @font-face {   
  15.   font-family: 'Iceland';   
  16.  &nbs

您可能想查找下面的文章:

  • CSS3实现滚动条动画效果代码分享
  • CSS3制作炫酷的自定义发光文字
  • 利用CSS3实现自定义滚动条代码分享

相关文章

  • 2017-06-02利用CSS3实现折角效果实例源码
  • 2017-06-02CSS3 Notes: -webkit-box-reflect实现倒影的实例
  • 2017-06-02浏览器实现移动端高性能css3动画(开启gpu加速)
  • 2017-06-02纯CSS实现菜单、导航栏的3D翻转动画效果
  • 2017-06-02CSS3实现跳动的动画效果
  • 2017-06-02CSS3 box-sizing属性
  • 2017-06-02CSS3 display知识详解
  • 2017-06-02CSS3实现同时执行倾斜和旋转的动画效果
  • 2017-06-02css3实现背景颜色渐变让图片不再是唯一的实现方式
  • 2017-06-02css3和jquery实现的可折叠导航菜单适合放在手机网页的导航菜单

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • css3发光搜索表单分享
    • 纯CSS实现菜单、导航栏的3D翻转动画效果
    • 利用CSS3的checked伪类实现OL的隐藏显示的方法
    • 实例教程 一款纯css3实现的数字统计游戏
    • CSS3圆角和渐变2种常用功能详解
    • 基于css3的属性transition制作菜单导航效果
    • 用css3制作纸张效果(外翻卷角)
    • 一款纯css3实现的响应式导航
    • 收集的22款给力的HTML5和CSS3帮助工具
    • 利用CSS3实现平移动画效果示例代码

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有