css box-shadow（text-shadow） 阴影学习备忘
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
*{
margin: 0px;
padding:0px;
} #test{
position: absolute;
top: 0px;
left: 0px;
right:0px;
bottom:0px;
width:500px;
height:500px;
margin:auto;
background-color: #ccc;
font-family: "楷体";
font-size: 30px;
text-align: left;
padding:5px 10px;
line-height: 40px;
box-shadow: 10px 20px 10px 10px #ccc, 30px 30px 10px 10px #c3c3c3;
overflow: auto;
}
</style>
</head>
<body>
<div id="test">浔阳江头夜送客，枫叶荻花秋瑟瑟。主人下马客在船，举酒欲饮无管弦。醉不成欢惨将别，别时茫茫江浸月。忽闻水上琵琶声，主人忘归客不发。寻声暗问弹者谁，琵琶声停欲语迟。移船相近邀相见，添酒回灯重开宴。千呼万唤始出来，犹抱琵琶半遮面。转轴拨弦三两声，未成曲调先有情。弦弦掩抑声声思，似诉平生不得志。低眉信手续续弹，说尽心中无限事。轻拢慢捻抹复挑，初为《霓裳》后《六幺》。大弦嘈嘈如急雨，小弦切切如私语。嘈嘈切切错杂弹，大珠小珠落玉盘。间关莺语花底滑，幽咽泉流冰下难。冰泉冷涩弦凝绝，凝绝不通声暂歇。别有幽愁暗恨生，此时无声胜有声。银瓶乍破水浆迸，铁骑突出刀枪鸣。曲终收拨当心画，四弦一声如裂帛。东船西舫悄无言，唯见江心秋月白。沉吟放拨插弦中，整顿衣裳起敛容。自言本是京城女，家在虾蟆陵下住。十三学得琵琶成，名属教坊第一部。曲罢曾教善才服，妆成每被秋娘妒。五陵年少争缠头，一曲红绡不知数。钿头银篦击节碎，血色罗裙翻酒污。今年欢笑复明年，秋月春风等闲度。弟走从军阿姨死，暮去朝来颜色故。门前冷落鞍马稀，老大嫁作商人妇。商人重利轻别离，前月浮梁买茶去。去来江口守空船，绕船月明江水寒。夜深忽梦少年事，梦啼妆泪红阑干。我闻琵琶已叹息，又闻此语重唧唧。同是天涯沦落人，相逢何必曾相识！我从去年辞帝京，谪居卧病浔阳城。浔阳地僻无音乐，终岁不闻丝竹声。住近湓江地低湿，黄芦苦竹绕宅生。其间旦暮闻何物？杜鹃啼血猿哀鸣。春江花朝秋月夜，往往取酒还独倾。岂无山歌与村笛？呕哑嘲哳难为听。今夜闻君琵琶语，如听仙乐耳暂明。莫辞更坐弹一曲，为君翻作《琵琶行》。感我此言良久立，却坐促弦弦转急。凄凄不似向前声，满座重闻皆掩泣。座中泣下谁最多？江州司马青衫湿。</div>
</body>
</html>
1、（具有宽高）元素的阴影
box-shadow属性接收一个由5个参数组成的值，每个值的意思如下：
h-shadow: 水平阴影的位置，可以为负值，默认向右，负值向左。
v-shadow:垂直阴影的位置，可以为负值，默认向下，负值向上。
blur：模糊距离
spread：阴影的尺寸
color：阴影的颜色
备注：box-shadow 可以设置过个阴影。
相关知识复习，字体大小，line-height: (字体行高,可以实现字体居中)，overflow:auto（内容超出容器高度，自动显示滚动条）
box-shadow: 10px 20px 10px 30px black, 30px 30px 10px 10px #c3c3c3;
效果：
2、 文字的阴影
text-shadow属性接收一个由4个参数组成的值，每个值的意思如下：
h-shadow: 水平阴影的位置，可以为负值，默认向右，负值向左。
v-shadow:垂直阴影的位置，可以为负值，默认向下，负值向上。
blur：模糊距离
color：阴影的颜色
text-shadow: 1px 2px 1px gray; 效果：
css box-shadow（text-shadow） 阴影学习备忘的更多相关文章
- Android学习备忘笺01Activity
01.设置视图 在Android Studio新建的项目中,通过 setContentView(R.layout.activity_main);方法将res/layout/activity_main. ...
- leaflet 学习备忘
leaflet 开源js地图工具.非常好用. leaflet参考:http://leafletjs.com/ 特性: 完全开源,可以基于不同的第三方瓦片生成地图. 基于原始GPS,无需转换 可创建离线 ...
- CSS学习备忘
CSS样式控制行间距,用line-height 测试一下: <div style="line-height:6px"> 111<br> 222<br& ...
- vue2.0 mintUI 学习备忘
一 技术栈:vuecli+vuejs2+mintUI+axios vuecli :脚手架工具 vuejs:前端框架 mintUI:基于vuejs移动端UI axios:vuejs ajax数据交互 ...
- UML学习备忘
两大类UML图: 行为图(behavior diagrams)和结构图(structure diagrams) 行为图将引导系统分析员分析且理清"系统该做些什么"?系统分析 ...
- easyUi学习备忘
1.获取datagrid的自身相关的属性方式: jQuery("#grid").datagrid("options").height jQuery(" ...
- Git学习备忘
本文参考廖雪峰写的精彩的git学习文档,大家可以直接去官网看原版,我这里只是便于自己记录梳理 原版地址:http://www.liaoxuefeng.com/wiki/0013739516305929 ...
- Android学习备忘笺02Fragment
Android中Fragment可以将UI界面分成多个区块,一般静态或动态添加Fragment. 01.新建Fragment实例 一个Fragment实例包括两个部分:类对象和布局文件(可视化部分). ...
- xml 基础学习备忘
<?xml version="1.0" encoding="UTF-8"? standalone="yes"> 这里的encod ...
随机推荐
- E - 梦幻岛宝珠 HYSBZ - 1190 变形01背包 难
E - 梦幻岛宝珠 HYSBZ - 1190 这个题目我觉得很难,看题解都看了很久. 首先可以得到一个大概的思路就是分组,每一个数都可以分成 a*2^b 所以把b相同的数都分成一个组. 在每一组内部 ...
- Android(H5)互相调用方法
记录一下前面混合开发时很重要的java与js互调方法进行数据交互. 混合开发就需要webview这个控件了 这就很玄学了,哈哈哈 这篇文章https://www.jianshu.com/p/3d9a9 ...
- 【Spark】必须要用CDH版本的Spark？那你是不是需要重新编译？
目录 为什么要重新编译? 步骤 一.下载Spark的源码 二.准备linux环境,安装必须软件 三.解压spark源码,修改配置,准备编译 四.开始编译 为什么要重新编译? 由于我们所有的环境统一使用 ...
- 【漫画】JAVA并发编程 如何解决原子性问题
原创声明:本文转载自公众号[胖滚猪学编程],转载务必注明出处! 在并发编程BUG源头文章中,我们初识了并发编程的三个bug源头:可见性.原子性.有序性.在如何解决可见性和原子性文章中我们大致了解了可见 ...
- Coda docs
a doc,反过来就是coda,有点冷. 对我而言,在线文档的好处在于在线数据库.存放代码等. Quip能高亮代码,但有时墙内不香,害得我用APP查看记录.Slite能高亮代码,但表格功能弱.号称al ...
- 可怕！CPU竟成了黑客的帮凶！
本故事根据CPU真实漏洞改编 前情回顾 还记得我吗,我是阿Q,就是那个CPU一号车间的阿Q啊.如果你忘记了我,记得看看这里回忆一下哦:完了!CPU一味求快出事儿了! 自从我们车间用上了乱序执行和分支预 ...
- leeCode刷题 lc184
Employee 表包含所有员工信息,每个员工有其对应的 Id, salary 和 department Id. +----+-------+--------+--------------+| Id ...
- MySQL索引知识介绍
前言: 索引是MySQL数据库中的重要对象之一,索引的目的在于提高查询效率.可以类比字典中的目录,查找字典内容时可以根据目录查找到数据的存放位置,然后直接获取即可.索引是表的目录,在查找内容之前可以先 ...
- angular 实现依赖注入
1:首先获取module对象var myAppModule = angular.module('myApp', []); 2:定义对象(类似spring中xml声明bean对象<bean id= ...
- babel转码时generator的regeneratorRuntime
今天写generator函数时发现出错:regeneratorRuntime. 在stackoverflow网友说需是本地babel软件包没有安装完全. package.json: "dev ...