Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/81.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 更改边框槽的第二种颜色?_Html_Css - Fatal编程技术网

Html 更改边框槽的第二种颜色?

Html 更改边框槽的第二种颜色?,html,css,Html,Css,我正在使用边框槽,但我需要编辑第二种颜色 border-right: 2px groove #FFFFFF; border-top: 2px groove #FFFFFF; 使用此代码恐怕您无法更改groove边框的第二种颜色。 您应该使用:after创建两个不同的边框。您需要一些CSS技巧来创建类似于groove的样式,请参见以下内容: HTML: <div class="border"> Hi I have two border colors<br />I am a

我正在使用边框槽,但我需要编辑第二种颜色

border-right: 2px groove #FFFFFF;
border-top: 2px groove #FFFFFF;

使用此代码

恐怕您无法更改groove边框的第二种颜色。
您应该使用:after创建两个不同的边框。

您需要一些CSS技巧来创建类似于
groove
的样式,请参见以下内容:

HTML:

<div class="border">
Hi I have two border colors<br />I am also Fluid
</div>
希望能解决问题

<div class="border">
Hi I have two border colors<br />I am also Fluid
</div>
div.border{
    border-right:2px solid #ffffff;
    border-top:2px solid #cccccc; 
    position:relative;
}
div.border:before{
    position:absolute; 
    display:block; 
    content:''; 
    border-right:2px solid #cccccc;
    border-top:2px solid #ffffff; 
    height:100%; 
    width:100%; 
    box-sizing: border-box; 
    -moz-box-sizing: 
    border-box; -webkit-box-sizing: 
    border-box;
    }