CSS笔记网站首页 CSS笔记

纯css样式网页标题添加阴影立体效果

作者：玉龙来源：css样式 2018-10-26 共有118人围观

文章简介 网页标题样式，添加阴影立体效果，非常不错的纯css样式，能制作出三维立方体效果

网页标题样式，添加阴影立体效果，非常不错的纯cssbj/ target=_blank class=infotextkey>css样式绘制，能制作出三维立方体效果，先看看效果图
css样式一
<a href=http://www.yulongbk.com target=_blank class=infotextkey>玉龙</a>博客个人博客.jpg

<a href=http://www.yulongbk.com target=_blank class=infotextkey>玉龙</a>博客个人博客.jpg

h4{
   text-align:center;
   font-size:4em;
   color:#9e110a;
   text-shadow:2px 2px 0px #fff,4px 4px 0px #cdcdcd;
   }

css样式二
玉龙博客个人博客.jpg

h5{
   text-align:center;
   font-size:4em;
   color:#a5536a;
   text-shadow:-2px -1px 0px #fff;
   }

css样式三
玉龙博客个人博客.jpg

h6{
   text-align:center;
   color:#fff;
   font-size:60px;
   text-shadow:0 1px 0 #ccc,
   0 2px 0 #C9C9C9,
   0 3px 0 #bbb,
   0 4px 0 #b9b9b9,
   0 5px 0 #aaa,
   0 6px 1px rgba(0,0,0,.1),
   0 0 5px rgba(0,0,0,.1),
   0 1px 3px rgba(0,0,0,.3),
   0 3px 5px rgba(0,0,0,.2),
   0 5px 10px rgba(0,0,0,.25),
   0 10px 10px rgba(0,0,0,.2),
   0 20px 20px rgba(0,0,0,.15);
   }