边框阴影

<!doctype html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>边框阴影</title>

	<style>
		.test {
			width: 200px;
			height: 200px;
			margin: 20px auto;
			line-height: 200px;
			text-align: center;
			background: #116ecd;
			border: 0px solid #116ecd;
			box-shadow: #398AFF 0px 0px 60px 5px;
		}
	</style>
</head>
<body>
	<div class="test"></div>
</body>

</html>

  

原文地址:https://www.cnblogs.com/xiaojf/p/12321006.html

时间: 2024-10-31 05:22:59

边框阴影的相关文章

css边框阴影

<style type="text/css">.mydiv{width:250px;height:auto;border:#909090 1px solid;background:#fff;color:#333;filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);/*ie*/-moz-box-shadow: 2px 2px 10px #909090;/

【边框】-边框阴影-box-shadow

CSS3之box-shadow边框阴影 div{box-shadow: 10px 10px 5px #888888;} 来自为知笔记(Wiz)

CSS3边框阴影

CSS3边框阴影实例: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>CSS3边框阴影</title> <style>  div { width:300px; height:100px; background-color:#ff9900; -moz-box-shadow: 5px 5px 5px #888888; /* 老的 Fi

swift UI专项训练36 ImageVi图片边框阴影

ImageView是我们经常用到的组件,但是我们发现storyboard中图片的属性编辑器中没有对于图片边框的设计.在view中添加一张普通的图片,效果是这样的: 可以看到,白色背景上的深色图片,效果总是有点突兀,我们想要加一个阴影边框来过渡一下图片和背景,打开图片所属的控制器代码,类中所显示的图片名为image,现在来设置它的边框.在viewDidLoad中输入以下代码: image.layer.backgroundColor = UIColor.orangeColor().CGColor i

边框阴影box-shadow

边框的阴影: 参数说明: box-shadow:1px 2px 3px 4px #ccc inset: 1px 从原点开始,沿x轴正方向的长度(倘若为负值,为沿x轴负方向的长度) 2px 从原点开始,沿y轴正方向的长度:(倘若为负值,为沿y轴负方向的长度) 3px 阴影的模糊度,只允许为正值 4px 阴影扩展半径 #ccc 阴影颜色 inset 设置为内阴影(如果不写这个值,默认为外阴影) 说明 1. 对于上边,沿x轴方向的偏移量显然没有意义,设为0px: 2. 沿y轴正方向阴影进入div内部,

CSS入门(css简介与样式汇总、CSS的使用方式、CSS样式表的特征、CSS基础选择器和复杂选择器、边框阴影)

一.CSS的作用 1.以统一的方式实现样式的定义 2.提高页面样式的可重用性和可维护性 3.实现了内容(HTML)和表示(CSS)的分离 HTML和CSS之间有什么关系? HTML:构建网页的结构 CSS :构建HTML元素的样式 样式汇总: color:red 字体颜色 font-size:字体大小 font-family:字体样式 background-color 背景颜色 width:宽度 height:高度 字体使用实例(样式) font-family:字体的种类 font-size:字

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

CSS3(1)---圆角边框.边框阴影 CSS3可以简单理解成是CSS的增强版,它的优点在于不仅有利于开发与维护,还能提高网站的性能. 一.圆角边框 圆角在实际开放过程中,还是蛮常见的.以前基本是通过背景图片做的,有了CSS3后可以使用简单的属性搞定,可以通过border-radius设置元素的圆角半径. 1.圆角边框语法 圆角边框属性 : border-radius 属性值 border-radius: 属性1,属性2,属性3,属性4 # 四个值:第一个值为左上角,第二个值为右上角,第三个值为

CSS3边框 阴影 box-shadow

box-shadow是向盒子添加阴影.支持添加一个或者多个. box-shadow: X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式]; 参数介绍: box-shadow: h-shadow v-shadow blur spread color inset; h-shadow:水平阴影的偏移值,必需,可以为负值. v-shadow:纵向阴影的偏移值,必需,可以为负值. blur:阴影模糊值,可选,不能为负值. spread:阴影的扩展,可选,可以为负值. c

边框阴影与轮廓

本文介绍如何给<div>标签以及图像添加阴影效果,用户还可以给网页中一些元素添加轮廓效果. box-shadow属性是给对象实现图层阴影效果. box-shadow: 投影方式  X轴偏移量  Y轴偏移量  阴影模糊半径  阴影拓展半径  阴影颜色; 投影方式  此参数是一个可选值,如果不设值,其默认的投影方式是外阴影:如果取其唯一值"inset",就是将外阴影变成内阴影. X轴偏移量  指阴影水平偏移量,其值如果为正值,则阴影在对象的右边:反之为负值,阴影在对象的左边.