您现在的位置是:网址首页 > PbootCMS学习 > 建站教程建站教程

【图文】002号模板|第03讲|PbootCMS仿美食招商加盟响应式网站仿站教程|复制CSS文件到本地

微脉网络2019-12-28已有50人围观

简介接下上一讲说了复制index.html的代码到本地了,打开的的话肯定是样式排版布局有问题,这是因为我们本地没有CSS文件以及JS文件,下面我们就将一下如何复制源网站的CSS文件到本地,使我们的网站样式···

上一讲说了复制index.html的代码到本地了,打开的的话肯定是样式排版布局有问题,这是因为我们本地没有CSS文件以及JS文件,下面我们就将一下如何复制源网站的CSS文件到本地,使我们的网站样式框架能够正常。

首先我们先看一下。这个网站的首页一共是需要两个CSS文件都是在头部的<head></head>标签中

<link rel="stylesheet" href="/Theme/v014/static/css/swiper.min.css" />
<link rel="stylesheet" href="/Theme/v014/static/css/index.css" />

那么如果将源网站的CSS文件复制到本地呢,很简单,根据下面的步骤来就行了:

01. 我们先到源网站的首页,然后右键➡查看源代码

12.jpg

02. 然后我们点击第一个swiper.min.css的链接

13.jpg

03. 将我们打开的CSS文件的所有代码复制

14.jpg

04. 在Dreamweaver中新建一个空白的CSS文件

15.jpg

05. 将我们复制的代码全部粘贴到这个CSS文件中

16.jpg

06. 我们先在我们桌面新建的文件夹中新建一个文件,命名为CSS

17.jpg

07. 然后我们将我们已经复制号的CSS文件保存到这个文件夹中,并命名为swiper.min.css(与源文件名要一致)

18.jpg

08. 同样的流程,我们将另外一个index.css文件也复制到本地。

19.jpg

09. 下面我们就修改下我们index.html文件调用这两个css文件的目录地址,首先用Dreamweaver打开我们的index.html文件。

然后将

<link rel="stylesheet" href="/Theme/v014/static/css/swiper.min.css" />
<link rel="stylesheet" href="/Theme/v014/static/css/index.css" />

修改为

<link rel="stylesheet" href="css/swiper.min.css" />
<link rel="stylesheet" href="css/index.css" />

如图:

20.jpg

注意,我们本地化修改index.html代码的时候 css/swiper.min.css 文件前面的 css 不能加 / (斜杠)

这样,我们就已经将css本地化成功了。

很赞哦! (5)



网站推荐 TOP 01

    【No:001】蓝色产品展示型网站模板带手机端模板

站点信息

  • 建站时间:2020年01月01日
  • 网站程序:PBOOTCMS
  • 标签管理标签云
  • 网站地图XML网站地图
  • 微信公众号:扫描二维码,关注我们
  • 公众号