鱼C论坛

 找回密码
 立即注册
楼主: 不二如是

[庖丁解牛] 0 0 3 3 - Shadow之块状元素阴影

[复制链接]
发表于 2018-11-2 09:30:54 | 显示全部楼层
学习
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

发表于 2019-1-6 20:23:57 | 显示全部楼层
RE: 0 0 3 3 - Shadow之块状元素阴影 [修改]
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2019-2-13 16:19:52 | 显示全部楼层
12
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

发表于 2019-4-17 19:42:33 | 显示全部楼层
学习

小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

发表于 2019-7-17 22:51:35 | 显示全部楼层
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

发表于 2019-8-18 15:26:26 | 显示全部楼层
交作业!
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.         <meta charset="UTF-8">
  5.         <title>Document</title>
  6.         <style type="text/css">
  7.                 div{
  8.                         height: 450px;
  9.                         width: 400px;
  10.                         background: #FFF;
  11.                         box-shadow: 0px 1px 2px 11px rgba(0,50,253,.5);
  12.                         float: right;
  13.                         position:absolute;
  14.                         top: 100px;
  15.                         left:350px;
  16.                         transform: rotate(-10deg);
  17.                 }
  18.                 div{
  19.                         text-align: center;
  20.                         padding: 10px 10px;
  21.                         border: 1px solid #BFBFBF;
  22.                 }
  23.                

  24.         </style>
  25. </head>
  26. <body>
  27.         <div>
  28.                 <h1 font face='verdana'>I am cat</h1>
  29.                 <img src="334.jpg" id="cat">
  30.         </div>
  31. </body>
  32. </html>
复制代码
捕获.PNG
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2019-10-31 19:22:55 | 显示全部楼层
作业~
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title></title>
  6. <style type="text/css">
  7. body {
  8.         text-align: center;
  9. }
  10. .box {
  11.         margin: 0 auto;
  12.         width: 300px;
  13.         height: 300px;
  14.         background: #e67e22;
  15.         border-radius:5px;
  16.         box-shadow: 0px 1px 2px 11px rgba(0,0,0,.15) /* inset */;
  17.         /* 第四个值 spread 阴影尺寸 和最后一位的值 inset(默认:outset) 变成内阴影 */
  18. }      
  19. </style>
  20. </head>
  21. <body>
  22.         <div class="box">
  23.                 <h1><font face="verdana">鱼C工作室</font></h1>
  24.                  <!-- font face="verdana" 设置"verdana"样式的字体 -->
  25.                 <p><font size="6" face="arial" color="#F4A">让编程改变世界</font></p>
  26.                 <p align="right"><font size="3" face="NSimSun" color="#888"><b>在下不二如是,失敬失敬</b></font></p>
  27.         </div>
  28. </body>
  29. </html>
复制代码
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2020-2-22 17:21:10 | 显示全部楼层
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <title>阴影</title>
  5.         <meta charset="utf-8">
  6.         <style type="text/css">
  7.             body {
  8.                 text-align: center;
  9.             }
  10.             .box {
  11.                 margin: 0 auto;
  12.                 width: 300px;
  13.                 height: 300px;
  14.                 background: #fff;
  15.                 border-radius: 5px;
  16.                 box-shadow: 0 1px 2px 11px rgba(0, 0, 0, .15);
  17.             }
  18.             h1 {
  19.                 text-shadow: 0px 8px 5px rgba(0, 0, 0, .5);
  20.             }
  21.             p {
  22.                 text-shadow: 1px 1px 0 rgba(243, 54, 212, 0.5) ;
  23.             }
  24.         </style>
  25.     </head>
  26.     <body>
  27.         <div class="box">
  28.             <h1><font face="verdana">鱼C工作室</font></h1>
  29.             <p><font size="6" face="arial">让编程改变世界</font></p>
  30.             <p align="right"><font size="3" face="NSimSun"><b>在下不二如是,失敬失敬</b></font></p>
  31.         </div>
  32.     </body>
  33. </html>
复制代码
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2020-3-13 22:17:25 | 显示全部楼层


                               
登录/注册后可看大图
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2020-3-16 17:05:44 | 显示全部楼层
wow
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

头像被屏蔽
发表于 2020-4-1 04:28:20 | 显示全部楼层
提示: 作者被禁止或删除 内容自动屏蔽
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

发表于 2020-5-30 15:35:03 | 显示全部楼层
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

发表于 2020-6-6 11:53:30 | 显示全部楼层
我爱小甲鱼
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2020-7-19 14:55:28 | 显示全部楼层
1111111111111
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2020-8-15 16:35:03 | 显示全部楼层
我想看
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2020-9-15 22:35:07 | 显示全部楼层
11111111111
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2020-9-18 16:52:57 | 显示全部楼层
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="utf-8">
  5.         <style type="text/css">
  6.             
  7.             h1 {
  8.                 background-color: white;
  9.                 height: 50px;
  10.                 text-align: center;
  11.                 text-shadow: 7px 10px 3px #13c557;
  12.                 box-shadow: 0px 0px 5px 5px black inset;
  13.                 border-radius:5px;
  14.             }

  15.         </style>
  16.     </head>

  17.     <body>
  18.         <h1>文字阴影</h1>
  19.     </body>
  20. </html>
复制代码
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2020-9-18 19:26:35 | 显示全部楼层
继续学习
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2020-12-12 19:49:17 | 显示全部楼层
1
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

发表于 2021-1-22 20:57:10 | 显示全部楼层
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2025-5-13 02:31

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表