实现效果如图:

代码如下:

 .section {
margin: 20upx 30upx;
padding: 40upx;
border-radius: 6px;
border-top: #0670C4 solid 6px;
/* 主要是下面两行 */
background-color: #FFFFFF;
box-shadow: #808080 0px 0px 10px;
}

一个box四周边框阴影的更多相关文章

  1. CSS3 02. 边框、边框圆角、边框阴影、边框图片、渐变、线性渐变、径向渐变、背景、过渡transition、2D转换

    边框圆角 border-radius 每个角可以设置两个值,x值.y值 border-top-left-radius:水平半径 垂直半径 border-radius:水平半径/垂直半径 border- ...

  2. “妄”眼欲穿-CSS之flex布局和边框阴影

    妄:狂妄: 不会的东西只有怀着一颗狂妄的心,假装能把它看穿吧. 作为一个什么都不会的小白,为了学习(zb),特别在拿来主义之后写一些对于某些css布局的总结,进一步加深对知识的记忆.知识是人类的共同财 ...

  3. CSS3(1)---圆角边框、边框阴影

    CSS3(1)---圆角边框.边框阴影 CSS3可以简单理解成是CSS的增强版,它的优点在于不仅有利于开发与维护,还能提高网站的性能. 一.圆角边框 圆角在实际开放过程中,还是蛮常见的.以前基本是通过 ...

  4. flex布局和边框阴影

    "妄"眼欲穿-CSS之flex布局和边框阴影 妄:狂妄: 不会的东西只有怀着一颗狂妄的心,假装能把它看穿吧. flex布局 main axis:主轴:cross axis:交叉轴 ...

  5. CSS之flex布局和边框阴影

    flex布局 main axis:主轴:cross axis:交叉轴 容器的子元素自动成为容器成员,成为flex 项目(item) flex容器属性 flex-direction ​ 该属性决定主轴的 ...

  6. css边框阴影

    <style type="text/css">.mydiv{width:250px;height:auto;border:#909090 1px solid;backg ...

  7. css3圆角边框,边框阴影

    border-radius向元素添加圆角边框,css3中的.IE9+ chrome safari5+ firefox4+ 现在都支持.可以向input div等设置边框.与border相似,可以四个角 ...

  8. Html/CSS前端如何实现文字边框阴影

    上次我们聊了<Html5前端如何实现文字阴影>,其实在开发中现在对于阴影效果的使用已经越来越广泛了,那么今天我们就来说一说用同样的手法实现边框阴影. 一.边框阴影box-shadow 边框 ...

  9. 从零开始学 Web 之 CSS3(二)颜色模式,文字阴影,盒模型,边框圆角,边框阴影

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

随机推荐

  1. H3C交换机IRF典型配置举例LACP MAD检测方式

    一.组网需求 由于公司人员激增,接入层交换机提供的端口数目已经不能满足PC的接入需求.现需要在保护现有投资的基础上扩展端口接入数量,并要求网络易管理.易维护. 二.组网图 三.配置思路 Device ...

  2. 程序员装X指南

      一.准备工作“工欲善其事必先利其器.” 1.电脑不一定要配置高,但是双屏是必须的,越大越好,能一个横屏一个竖屏更好.一个用来查资料,一个用来写代码 .总之要显得信息量很大,效率很高. 2.椅子不一 ...

  3. python3-基础1

    eval()  --- 返回表达式计算结果 实际上就是把括号中的命令提取出来执行一遍. eval("print('ok')") ok 可变类型: 在ID不变的情况下,value可变 ...

  4. ActiveMQ( 一) 同步,异步,阻塞 JMS 消息模型

    同步请求:浏览器 向服务器 发送一个登录请求,如果服务器 没有及时响应,则浏览器则会一直等待状态,直至服务器响应或者超时. 异步请求:浏览器 向服务器 发送一个登录请求,不管服务器是否立即响应,浏览器 ...

  5. VUE开发

    待完善... Node.js    参考文档:http://nodejs.cn/ Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境.  Node.js 使用了一个 ...

  6. sklearn错误

    1.No module named 'sklearn.cross_validation' sklearn.cross_validation会报错,关键在于新版本的sklearn没有cross_vali ...

  7. docker-网络基础配置和dockerfile

    00x1: 端口映射: 如图:这就是把容器的 5000端口和主机的32768端口相映射,所以通过访问主机的32768端口就可以访问容器的web界面 这个端口是系统默认的如果自定义命令:docker r ...

  8. docker 搭建 hustoj

    docker 搭建 hustoj hustoj 是个GPL开源的OJ,其提供了docker形式的安装方式. 为执行方便,选择使用aliyun提供的docker镜像来加速安装. 拉取镜像 docker ...

  9. dpdk环境配置

    1.配置流程 [1]修改/boot/grub2/grub.cfg,添加下列标记的配置项. linux16 /vmlinuz--.el7.x86_64 root=/dev/mapper/centos-r ...

  10. mybatis逆向工程没有报错,但是也没有pojo和Mapper文件问题

    如果你使用的逆向工程是自己手写上去的配置文件,那么错误的范围就太大了.如果是你导入以前使用过的逆向工程,那么没有生成文件很可能是使用的操作系统不同. 原因:逆向工程中的路径问题,windows和mac ...