在上一节中,我主要讲到了如何获取ThinkPHP框架,以及虚拟目录和虚拟主机的配置。准备工做完成以后,就能够利用ThinkPHP去部署项目了。php
先在工做目录(D:/zend/workspace)下新建一个market文件夹,用来部署项目,在market文件下再新建一个index.php,做为项目的入口文件。由于咱们须要调用ThinkPHP框架,打开本身下载好的ThinkPHP框架文件,将其中的ThinkPHP文件夹(其余的Application、Public等均不须要)复制一份到D:/zend/workspace目录下(与market文件夹同级,由于ThinkPHP框架能够支持多个项目调用,不只限于这一个项目),利用zend studio打开index.php,去引入框架的核心程序。css
这里用到了相对路径知识,
../
表示上一级目录,后面会介绍到html
以后,在浏览器中输入www.myweb.com/market,出现以下效果,则说明框架引入成功。前端
当框架引入成功以后,market文件夹会自动生成3个文件夹,以下图:web
其中Home文件夹下的内容以下:浏览器
接下来即利用Home文件夹去部署雍达商城前端页面。雍达商城前端页面主要包括以下几个部分:框架
选取其中的几个页面为例,根据其功能的不一样,在Home文件夹中建立控制器和对应的视图文件,引入相应的文件,最后效果以下图:网站
具体实现流程再也不细致讲解,对于其中的一些注意事项进行分析。spa
引入模板文件后,原先html文件和css文件之间的相对路径关系会发生改变,须要考虑如何去进行调整,使css样式正确显示(包括图片也是同样的道理),这时就须要考虑相对路径和绝对路径问题了。code
绝对路径就是文件的真正存在的路径,是指从硬盘的根目录开始,进行一级级目录指向文件。
相对路径就是以当前文件为基准进行一级级目录指向被引用的资源文件。
../
表示当前文件所在的目录的上一级目录./
表示当前文件所在的目录(因此能够省略不写)/
表示当前站点的根目录(域名映射的硬盘目录)(咱们一下子会用到)就拿这个项目为例,当我把前台模板文件都移植到market文件后,须要对html、css、img之间的相对路径关系进行调整,以其中的inex.html为例,原始样式以下:
而移植到market文件后,变成了以下效果:
能够看出,html文件正常显示,可是css样式和图片没有正常显示,其中的相对路径关系从目录结构中能够看出
index.html文件所在的绝对路径为:D:/zend/workspace/market/Home/View/Index/index.html
style.css文件所在的绝对路径为:D:/zend/workspace/market/Public/Home/css/style.css
如何才能在index.html文件中正确引用style.css文件?
符号 | 含义 | 当前路径地址 |
---|---|---|
../ | 上一级目录 | D:/zend/workspace/market/Home/View/... |
../../ | 上上级目录 | D:/zend/workspace/market/Home/... |
../../../ | 上上上级目录 | D:/zend/workspace/market/... |
根据index.html和style.css的绝对路径地址以及表格分析,咱们能够看出当跳了三级目录(../../../)时,能够正确地去引用style.css
../../../Public/Home/css/style.css <=> D:/zend/workspace/market/Public/Home/css/style.css
一样地,css样式调整好以后,还须要调整html文件与img之间的引用关系。
index.html文件所在的绝对路径为:D:/zend/workspace/market/Home/View/Index/index.html
不少图片都存储在images文件夹下,而images文件所在的绝对路径为:D:/zend/workspace/market/Public/Home/images
ThinkPHP框架的URL地址能够有如下四种形式:
前面咱们讲到了通常状况下是如何进行绝对路径和相对路径的调整,而结合TP框架进行设置时,咱们还须要遵循必定的规则,根据路由形式选择的不一样,可能会形成必定的影响。
当咱们采用pathinfo路径形式去访问页面时,若是咱们但愿利用相对路径的形式去引用css或者图片,上面讲到的路径形式是没有问题的,由于这时它是以index.html为基准去引用style.css
当采用基本get形式去访问页面时,若是咱们但愿采用相对路径的形式去引用css或者图片,这时它并非以index.html为基准,而是以项目的入口文件index.php为基准,因此若是还按照上面讲到的路径形式去设置的话,就会出现问题。
index.php的绝对路径为D:/zend/workspace/market/index.php
正确的引用路径为:./Public/Home/css/style.css(./
表示当前目录,能够省去),而不是上面讲到的../../../Public/Home/css/style.css。
为了不这类问题的出现,咱们能够采用绝对路径,但不采用上面讲到的方式。
咱们在前面说起到/
表示当前站点的根目录(域名映射的硬盘目录),即咱们以前设置的虚拟目录位置D:/zend/workspace,/
就等价于该地址,因此利用这种方式,正确的引用路径为:/market/Public/Home/css/style.css.
对于图片的引用也是同样的道理,这里再也不赘述。这样一来,index.html对于css样式和img的引用就完成了,其余页面的引用均相似,进行一番调整即可以正确引入css和图片。
某些css样式里也有图片,在引入图片时,可使用相对路径,它是以css文件自身为基准,与其余文件没有关系。
注:以上内容仅是我看过视频教程后我的的一些理解,可能会有不当之处,望理解:)...