郎平女儿身高是多少:HTML简单边框制作--立体线条边框的变化

立体线条边框的变化

下面是一段可以改变立体线条边框形状、粗细、颜色和框内背景颜色的代码：

Groove;border-width:7pt; border-color: red">

border-style:

说明：

这段代码是在border-style后面使用不同的语法描述来改变边框形状的：

简单线形边框; Solid 简单双线边框; Double 沟线立体效果边框; Groove 脊线立体效果边框; Ridge 嵌入线立体效果边框; Inset 浮出线立体效果边框Outset

边框线条颜色的改变方法：

绿色处可改变边框的颜色,用英语单词表示也可,用#xxxxxx的形式表示也可.(见颜色值表)=》 

边框背景颜色的改变方法：

改变边框内背景颜色的方法就是在桃红色代码处改变颜色值。（可能随便填一个6位数的值，要想得到你想要的准确颜色就要参看“颜色值表”）

下面是将边框线条形状、粗细等改变后的效果：

1、简单线形边框： Solid 边框颜色为绿色 border-color: #00ff00

背景颜色为background-color:#ffdead（米黄色）

不是立体

背景颜色为background-color: #44FFFF（天蓝色）

不是立体

3、沟线立体效果边框：Groove 边框颜色为border-color: #ff0000 （红色） 背景颜色为background-color: #0000ff（蓝色）

4、脊线立体效果边框：Ridge 边框颜色为border-color: #44ffff（天蓝色） 背景颜色为background-color: #ff0000（红色）

5、嵌入线立体效果边框：Inset 边框颜色为border-color: #a000ff（紫色） 背景颜色为background-color: #a0ff60（黄绿色）

6、浮出线立体效果边框：Outset 边框颜色为border-color: #ff00ff（桃红色） 背景颜色为background-color: #ffa0ff（肉红色）

外边框包内边框的代码