代码教程

HTML代码用H1吧,这样语义化好些,因为标题一般用h1-h6.

<h1 class="vintage">美丽的中国语</h1>

纯CSS制作的复古风格的大标题

.vintage{
background: #EEE url(data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAIAAAAmkwkpAAAAHklEQVQImWNkYGBgYGD4//8/A5wF5SBYyAr+//8PAPOCFO0Q2zq7AAAAAElFTkSuQmCC) repeat;
text-shadow: 5px -5px black, 4px -4px white;
font-weight: bold;
-webkit-text-fill-color: transparent;
-webkit-background-clip: text }

CSS空心文字

.stroke{
color: transparent;
-webkit-text-stroke: 1px black;
letter-spacing: 0.04em;
background-color: }

CSS内阴影文字效果

.press {
color: transparent;
background-color : black;
text-shadow : rgba(255,255,255,0.5) 0 5px 6px, rgba(255,255,255,0.2) 1px 3px 3px;
-webkit-background-clip : text;
}

CSS 实现3D感文字标题

.threed{
color: #fafafa;
letter-spacing: 0;
text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px #333, 0px 8px 7px #001135 }

css3制作字体的更多相关文章

  1. CSS3制作404立体字体

    CSS3制作404立体字体页面效果     鼠标移动上去,背景色变白.       动态效果:     .demo p:first-child span:hover { text-shadow:0px ...

  2. CSS3制作旋转导航

    慕课网学习CSS3时,遇到个习题,觉得有必要总结学习下:CSS3制作旋转导航 慕课网习题地址:http://www.imooc.com/code/1883 示例及源码地址:http://codepen ...

  3. 图解CSS3制作圆环形进度条的实例教程

    圆环形进度条制作的基本思想还是画出基本的弧线图形,然后CSS3中我们可以控制其旋转来串联基本图形,制造出部分消失的效果,下面就来带大家学习图解CSS3制作圆环形进度条的实例教程 首先,当有人说你能不能 ...

  4. css3制作旋转动画

    现在的css3真是强大,之前很多动画都是用jq来实现,但是css3制作的动画要比jq实现起来简单很多,今天呢,我自己也写了一个css旋转动画和大家分享.效果如下面的图片 思路:1.制作之前呢,我们先来 ...

  5. 详解用CSS3制作圆形滚动进度条动画效果

    主  题 今天手把手教大家用CSS3制作圆形滚动进度条动画,想不会都难!那么,到底是什么东东呢?先不急,之前我分享了一个css实现进度条效果的博客<CSS实现进度条和订单进度条>,但是呢, ...

  6. CSS3制作心形头像

    1.功能需求: 最近有一个基于微信开发的Mobile Web项目,是一个活动页面.功能需求:用户使用微信扫描二维码,然后授权使用微信登录,然后读取用户的昵称和头像,然后显示在一个饼图上面.头像需要有一 ...

  7. 使用 jQuery 和 CSS3 制作滑动导航菜单

    这个下拉菜单可以让你的网站非常优雅,滑动框导航效果令人印象深刻.此外,子菜单框也可以与此集成起来以使其更具吸引力.导航是网站成功的关键之一,有吸引力的导航能够引导用户浏览网站中的更多内容. 效果演示  ...

  8. 使用 jQuery & CSS3 制作美丽的照片画廊

    在本教程中,我们将创建一个很好看的照片画廊效果.我们的想法是,以显示专辑作为一个滑块,而当这张专辑被选中,我们将使用一个美丽的照片堆栈展示专辑的图像.在照片堆栈视图,我们可以通过将最上面的图像移动到所 ...

  9. 网页特效:用CSS3制作3D图片立方体旋转特效

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

随机推荐

  1. canvas实现画板功能(渐变、动画、阴影...)

    刚刚在博客园落户了,希望能在这认识更多大神,希望能和大家交好朋友. 闲来无事,把以前用canvas写的画板代码改进了一番,用Html5提供的表单标签给其 加了一个选择颜色的功能,因此发现了该标签的一个 ...

  2. Ubuntu14.04安装PHP5

    因为任务需要在Ubuntu14.04的server版本下安装PHP5,所以总结一下   使用root进行安装  要么在前面加上sudo进行安装. apt-get install php5-cgi ap ...

  3. java.lang.IllegalArgumentException: View not attached to window manager

    公司项目线上bug: java.lang.IllegalArgumentException: View not attached to window manager at android.view.W ...

  4. QTREE - Query on a tree

    QTREE - Query on a tree 题目链接:http://www.spoj.com/problems/QTREE/ 参考博客:http://blog.sina.com.cn/s/blog ...

  5. 五大科技巨头VR/AR专利报告,Magic Leap以22.6%领跑

    在十月份发布的<VR/AR专利技术深度分析报告>指出,VR.AR行业的专利多被佳能.索尼.微软.谷歌等科技巨头"包养",但是并没有对这部分进行详细分析.近日,风投公司C ...

  6. 【Python】回文

    首先判断一个字符串是否回文: def isPlalind(s): if len(s) == 1: return True else: return s[0] == s[-1] and isPlalin ...

  7. java中equals方法和contentEquals方法区别

    java中,String类里提供了两种字符串的比较方式(算上“==”应该是三种) String line1 = new String("0123456789"); String l ...

  8. 【实验室笔记】C#的Socket客户端接收和发送数据

    采用socket发送和接收数据的实验中,服务器采用的是网络助手作为模拟服务器端. 客户端程序流程: 应用的命名空间: using System.Net; using System.Net.Socket ...

  9. Introduction to Programming Contests (stanford)

    http://web.stanford.edu/class/cs9http://web.stanford.edu/class/cs97si/7si/

  10. @property (nonatomic, getter = isExpanded) BOOL expanded;

    如果这个property是 BOOL on, 那么Objc默认创建的 setter 为: - (void)on:(BOOL)setOn { } getter 为: - (BOOL)on { retur ...