那就做个shadow案例吧!我是杨雪,这些css对我来说小菜一碟

原创 2019-01-31 17:04:57 362
摘要:<!DOCTYLE html><html><head><meta charset="utf-8"><title>那就做个shadow案例吧!我是杨雪,这些css对我来说小菜一碟</title><style>.besideshadow{background-color:green;width:60


<!DOCTYLE html>


<html>


<head>


<meta charset="utf-8">


<title>那就做个shadow案例吧!我是杨雪,这些css对我来说小菜一碟</title>


<style>


.besideshadow{background-color:green;width:600px;height:200px;box-shadow:20px 20px 5px #ccc;color:white;font-size:50px;line-height:200px;padding-left:200px;}

.insideshadow{margin:100px 0px;background-color:green;width:600px;height:200px;box-shadow:100px 150px 200px #ccc inset;color:white;font-size:20px;line-height:200px;padding-left:200px;}

</style>


</head>


<body>


<div  class="besideshadow" >


先做一个外面阴影

</div>

<div class="insideshadow">

再做一个内阴影,说好的圆柱呢?怎么调不出来?


</body>






</html>


批改老师:天蓬老师批改时间:2019-01-31 17:20:26
老师总结:box-shadow:100px 150px 200px #ccc inset;你这样阴影是不是有点太大了, 元素修饰,点到为止, 不可以过复杂,会影响到元素的内容展示,毕竟对于用户有用的是内容,而不是样式,对不?

发布手记

热门词条