css成品模型,css框模型

网址导航

今天做的是用css框模型写一个网址导航，用到了类选择器，这里面也捎带了一个背景图片的填充，边框的上下左右颜色设置，整个框模型的尺寸(border关键词)；以及超链接的位置取消默认所带下划线，当然这些都是一些小的细节问题。

其中“line-height”设置边框线的高度，设置css背景的时候需要有“url”，图片的话最好存放在代码所在的目录，也就是相对路径性的存放。

最后下面的超链接内有一个“target”和“blank”两个关键字，意思是：点击当前的超链接会打开一个新的窗口。

源代码：

超网址导航

.box1{

width:300px;

height: 600px;

border-color: red gold green yellow;

border-style: solid;

border-width: 10px;

background-image: url('1-菜单背景.jpg');

}

a{

text-decoration: none;

text-indent: 2em;

line-height: 10px;

}

.wz{

color:gold;

line-height: 4px;

text-decoration-line: 20px;

}

网址导航

---

百度

酷狗音乐

凤凰网

新浪

谷歌翻译

CSDN社区

简书

GIT库

W3 school html

效果图

image.png