css中div边框外发光怎么设置

html-css026

css中div边框外发光怎么设置,第1张

.xx{  box-shadow: 0 0 15px #4E4E4E padding:10px }

这两个0是  左右  上下。用px调整。如果是0就是居中。

15px是你要光圈。越大就范围就越广。类似于病毒扩散那种感觉.padding可无视，是为了放你class一个span或button自己就撑开了

百度这个确实是css写出来的，代码如下：

----------------------------------------------------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head>

<title>无标题页</title>

<meta http-equiv="Content-Type" content="text/htmlcharset=UTF-8" />

<style>

div { margin:0padding:0border-color:#333font-size:12pxtext-align:centerline-height:70px}

.box-rod { width:200pxmargin:100px auto}

.rod { height:80pxborder-left: 1px solidborder-right: 1px solid}

.box-rod .rod1 { border-top: 1px solidfont-size: 0height: 0margin: 0 3pxoverflow: hidden}

.box-rod .rod2, .box-rod .rod3 { border: 0 solidheight: 1pxmargin: 0 1pxoverflow: hidden}

.box-rod .rod2 { border-left-width: 2pxborder-right-width: 2px}

.box-rod .rod3 { border-left-width: 1pxborder-right-width: 1px}

.box-rod .rod4 { border-bottom: 1px solidfont-size: 0height: 0margin: 0 3pxoverflow: hidden}

</style>

</head>

<body>

<div class="box-rod">

<div class="rod1"></div>

<div class="rod2"></div>

<div class="rod3"></div>

<div class="rod">确实css写的</div>

<div class="rod3"></div>

<div class="rod2"></div>

<div class="rod4"></div>

</div>

</body>

</html>