关于网页css

html-css09

关于网页css,第1张

当然不会再起作用,通常这些css文件是用过相对路径链接到一个页面的,下载到你的电脑上以后打开页面,浏览器会尝试使用相同的相对路径寻找这个css文件,但是很明显你的电脑上并没有这个文件而是在网站的服务器上。文件找不到自然不会生效,另一种情况如果这个css文件是通过一个有效的地址链接的(如http://www.google.com/css/example.css),那当你打开下载的页面的时候如果有网络则会生效,浏览器则会从互联网上下载这个文件,

但是通常一个页面都是通过相对路径链接的,所以你需要下载页面的同时下载这个css文件并且按照其链接的路径正确放置。使用google浏览器可以非常方便的下载这些外联的文件

关于相对路径

http://www.wangqi.com/html/2005-01/357.htm

google浏览器

http://www.google.com/chrome/index.html?hl=zh-CN

整个的外围大框,是一个外围容器,通常用border来设置

其中的内容通常用列表

<ul>

<li>1</li>

<li>2</li>

</ul>来做

就你给的图来说,通常会做一个外围容器,其中内容会用ul列表详细的css如下

/*外围容器*/

.bigbox{

float:left

width:250px

height:auto

margin:0

padding:10px

border:#e5e5e5 1px solid /*这里是你问的主要问题,用这句实现*/

}

.bigbox ul li{

list-style:none

float:left

width:230px

height:60px

}

.bigbox ul li .imgbox{

float:left

width:60px

height:45px

}

.bigbox ul li .imgbox img{

margin:0

padding:0

border:none

}

.bigbox ul li .content{

float:right

width:110px

height:45px

}

css样式要配合div的页面布局来使用,对以上的css配合的html div布局如下

<div class="bigbox">

<ul>

<li>

<div class="imgbox">这里主要是放置图片内容</div>

<div class="content">这里主要是放置文字内容</div>

</li>

<li>

<div class="imgbox">这里主要是放置图片内容</div>

<div class="content">这里主要是放置文字内容</div>

</li>

</ul>

</div>