怎么设置div的边框为蓝色?

怎么设置div的边框为蓝色?,第1张

div设置边框相关如下:

border-color:#000设置4边边框颜色为黑色;

border-color:+颜色值,即可设置对象边框颜色;

border-left-color:#000

设置左边框颜色为黑色;

border-right-color:#000

设置右边框颜色为黑色;

border-top-color:#000

设置上边框颜色为黑色;

border-bottom-color:#000

设置下边框颜色为黑色;

条件:必须设置对象边框存在,设置边框宽度必须大于或等于1px,边框颜色才会显示并有存在意义。

.divcss5{

border-style:solid

border-width:1px

border-color:#000}

这样就设置对象边框为实线边框,边框宽度(厚度)为1px,边框颜色为黑色,这样设置边框颜色才会生效。

在数据库中增加一个颜色字段,在后台为每个数据设定颜色,这样你在页面输出数据的同时,把颜色的字段值一起输出页面,这个时候可以根据CSS或者JS来设定该数据所在的DIV显示什么颜色。

例如:

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

数据库中的字段值

id name color

1 AA公司  red

2 BB公司 blue

3 CC公司 yellow

4 DD公司 black

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

前端页面

<?php

  while ($row = $result->fetch_assoc()) {

    echo"<div class='".$row["color"]."'>".$row["name"]."</div>"

  }

?>

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

CSS代码:

.red { background-color: red}

.blue { background-color: blue}

.yellow { background-color: yellow}

.black { background-color: black}

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

这个是简易说明,比较简单用的是CSS来判断,为每个color设定一个背景色。

HTML:

<ul>

<li class="yyhj_pic1" onmouseover="setTab('yyhj',1,5,'hover4')"><a id="yyhj1" href="/" class="hover4"></a></li>

<li class="yyhj_pic2" onmouseover="setTab('yyhj',2,5,'hover4')"><a id="yyhj2" href="/" ></a></li>

</ul>

JS:

function setTab(name,cursel,n,ElmName){

for(i=1i<=ni++){

var menu=document.getElementById(name+i)

menu.className=i==cursel?ElmName:""

}

}

hover4是要改变的样式就是链接白色背景蓝色

onmouseover是鼠标经过的效果自己改成onclick,好像是这么拼。。。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/7991507.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-12
下一篇 2023-04-12

发表评论

登录后才能评论

评论列表(0条)

保存