建站资讯

php168怎样效仿他人的网站布局(仿站文图实例教

作者:admin 发布时间:2020-11-20
一一样的网站储存以后基本也没有甚么难题了,能够开启储存的网页页面看一下.基本和原来的网站区别并不大.
自然也是有将会和本来的网站区别较为大的.这多是因为款式表的难题导致的.
如今大家开启大家刚刚储存的网站看一下实际效果如何样?

大家查询一下编码看一下:
在编码里边检索:style这一重要字.
寻找下边的编码:
style type= text/css media= screen
@import url( /CS_version/css/home.css
/style
而大家储存出来的构造是这一模样的:

显而易见上边的编码的css相对路径不是对的.
那么我们改一下.大家

style type= text/css media= screen
@import url( /CS_version/css/home.css
/style
改为: link href= fangzhi_files/home.css rel= stylesheet type= text/css
再看一下,還是不好.那毫无疑问還是款式的难题.
大家开启fangzhi_files/home.css这一文档看一下:
最上边二行是那样的:
@import url( /CS_version/Css/cs_home.css );
@import url( /CS_version/css/validform.css );
原先他在home.css这一文档里边又导进了别的2个css文档.可是很显著相对路径又不对.
大家改一下相对路径,改为下边的模样.
@import url(cs_home.css );
@import url(validform.css );
以后储存home.css这一文档.再说看一下储存的网页页面,有点儿像了

可是也有一些照片不可以一切正常显示信息.此次你应当了解了,毫无疑问是相对路径难题.
好,那麼到home.css文档(还包含cs_home.css和validform.css)里边看一下,大家会发觉例如:BACKGROUND-IMAGE: url(/CS_version/CS_img/home/logo_mid.gif);
里边的相对路径/CS_version/CS_img/home/logo_mid.gif都改成logo_mid.gif,即除掉/CS_version/CS_img/home/.
由于如今全部照片和css文档在同一级文件目录里边.自然你可以以依据具体状况改动这一文件目录.
再更新看一下,可是也有些照片不可以一切正常显示信息.那麼大家就需要考虑到有将会沒有把一部分照片储存出来.那麼立即到原先网站储存相匹配照片到css文档所属文件目录.
再看一下

第二步:除去储存出来的网页页面里边无用的內容(包含网网站内部容,无用的html编码,无用的js编码,无用的非常连接等),
把地区空出来,由于这种地区大家要用php168的标识来动态性的启用网站的內容.

第三步:溶解刚刚解决好的网页页面为三个文档:
head.htm(网页页面头顶部,一般在这里个一部分置放登录表格,导航栏莱单,logo,这些)
index.htm(网页页面行为主体,一般在这里个一部分用标识启用网站每个频道的內容这些)
foot.htm(网页页面底端,一般在这里个一部分显示信息一些著作权信息内容)
第四步:在除去內容的地区添加标识$label,在其中*是以英文字母开始的英文字母和数据的随意融合.
这一$label能够加到head.htm,index.htm,foot.htm,list.htm,bencandy.htm中。
[注].标识$label是啥物品?
大家打个比如来讲明一下。例如你如今有一个好看的静态数据网页页面架构。你要把这一好看的静态数据网页页面架构作成动态性网页页面,
以便捷內容的加上及变更。那麼你只必须在要显示信息內容的地区加上例如$label[**]的标识。随后再做简易的解决。
那麼原先好看可是简易的静态数据网页页面便会变为作用强劲的动态性网站。并且漂亮依然。简易的说,
还可以用他来显示信息几行几列的照片目录。还能够用他来显示信息falsh,幻灯片图片片照片,文本+一部分內容目录这些。
大家还能够用他来显示信息一些软件,例如:气温气象预报,检索模块,网络投票频道这些。
第五步:设计风格的制作
上边大家简易的讲过一下标识$label[**]。大家说他象一面旗子,能够插不在同的部位显示信息不一样的內容。
那麼大家拥有旗子,要往哪儿放呢?下边大家来详细介绍一下插放这种标识的地区----网页页面模版文档。
网页页面模版总的分成php168默认设置设计风格模版和自身制作的设计风格模版。她们都放到template文档夹下边。
在其中template/default/为默认设置模版储放的地区。由于是默认设置的因此大家尽可能不必修改他.
关键默认设置模版文档表明:
alonepage.htm(单独网页页面模版)
bencandy.htm(內容网页页面模版)
comment.htm(评价网页页面模版)
comment_ajax.htm(评价ajax网页页面模版)
guestbook.htm(留言板留言本网页页面模版)
list.htm(目录网页页面模版)
login.htm(登录网页页面模版)
post.htm(公布网页页面模版)
refreshto.htm(自动跳转网页页面模版)
reg.htm(申请注册网页页面模版)
search.htm(检索网页页面模版)
showerr.htm(标示提醒网页页面模版)
splist.htm(专题讲座目录网页页面模版)
spshow.htm(专题讲座內容网页页面模版)
vote.htm(网络投票网页页面模版)
之上是关键的模版文档。你可以以依据你的必须制作自身的模版,不一定所有制作。
一般关键制作head.htm,index.htm,foot.htm,bencandy.htm,list.htm就基本能够考虑必须了。
当访问着访问你的网页页面的情况下,你制作的模版便会展现给访问者,但你沒有制作的模版系统软件会启用默认设置的模版文档。
自然一个网页页面里边将会包含照片文档。这种照片文档被置放在images文档夹下边。
默认设置设计风格里边的照片被置放在images/default/下边。自然,一个网页页面模版还必须一些css款式操纵。
这种款式一般置放在相匹配的照片文档夹里边。比如images/default/default.css
此外也有一个php文档用于界定这种设计风格,便于在后台管理能够随意转换。
这种设计风格操纵文档是一个个的.php文档。都放到php168/style/下边。比如默认设置的为:php168/
那么我们要建立自身的设计风格如何办呢?好,下边我还们举个案子表明一下:例如我觉得建立一个设计风格。
这一设计风格如同大家的小孩。大家以便之后便捷叫法和启用他,大家毫无疑问必须给这一设计风格起一个姓名。
大家回望一下上边一个文章段落里边默认设置设计风格的文件格式。大家会发觉,一个设计风格模版应当包括三个一部分。即:
Tempalte/default/储放设计风格模版的网页页面文档
Images/default/储放设计风格模版选用到的照片文档
Php168/界定这种设计风格
那麼你可以以在建一个设计风格模版应当放到下边文件格式的文档夹里边:
Template/my168home/这一里边放网页页面模版
Images/my168home/这一里边放网页页面模版采用的照片
Php168/ 这一文档夹里边的php文档用于操纵款式。
第六步:将模版里边的照片相对路径改成:$webdb[www_url]/images/$STYLE/
第七步:添加一些特殊的编码
设计风格需要基本编码
*********************************
head.htm
头顶部特殊编码
!--
?php
print EOT
--
head
title $titleDB[title] powered by /title
link rel= stylesheet type= text/css href= $webdb[www_url]/images/default/default.css
link rel= stylesheet type= text/css href= $webdb[www_url]/images/$STYLE/css.css
meta http-equiv= Content-Type content= text/html; charset=gb2312
meta name= keywords content= $titleDB[keywords]
meta name= description content= $titleDB[description]
/head
SCRIPT LANGUAGE= JavaScript
!--//导航栏莱单
function guide_link(fid){
if(fid==0){
window.location.href= $webdb[www_url]/
}else{
window.location.href='$webdb[www_url]/list.php?fid='+fid;
}
}
function killErr(){
return true;
}
window.onerror=killErr;
//--
/SCRIPT
SCRIPT LANGUAGE= JavaScript
!--//解决大归类一行2个小归类
function autoTable(div){
fs=document.getElementById(div).getElementsByTagName( TABLE
for(var i=0;i fs.length;i++){
fs.style.width='49.5%';
if(i%2==1){
if (document.all) {
fs.style.styleFloat= right
}else{
fs.style.csloat= right;
}
}else{
if (document.all) {
fs.style.styleFloat= left
}else{
fs.style.csloat= left;
}
}
}
}
//--
/SCRIPT
SCRIPT LANGUAGE= JavaScript src= $webdb[www_url]/images/default/inc.js /SCRIPT
SCRIPT LANGUAGE= JavaScript src= $webdb[www_url]/images/default/default.js /SCRIPT
SCRIPT LANGUAGE= JavaScript src= $webdb[www_url]/images/default/swfobject.js /SCRIPT
SCRIPT LANGUAGE= JavaScript src= $webdb[www_url]/php168/$fidson_menu /SCRIPT
body bgcolor= #FFFFFF text= #000000 leftmargin= 0 topmargin= 0
SCRIPT LANGUAGE= JavaScript
!--//目地是以便做设计风格便捷
document.write(' div > //--
/SCRIPT
______________________
尾部特殊编码
!--
EOT;
?
--
********************************
index.htm
头顶部特殊编码
!--
?php
print EOT
--
_________________
尾部特殊编码
!--
EOT;
?
--


********************************
foot.htm
头顶部特殊编码
!--
?php
print EOT
--
_____________________________________
尾部特殊编码
SCRIPT LANGUAGE= JavaScript
!--//目地是以便做设计风格便捷
document.write(' /div
//--
/SCRIPT
SCRIPT LANGUAGE= JavaScript
!--
clickEdit.init();
//--
/SCRIPT
/body
/html
!--
EOT;
?
--
**************************
list.htm
头顶部特殊编码
!--
?php
$listdb_pic=ListPic($rows=4,$leng=30); //照片主题风格
$listdb_pic || $hide_listpic='none'; //不会有照片主题风格得话.要把照片主题风格的外框掩藏
$listdb || $hide_listnews='none'; //假如是大归类得话,也不存有题目,就把题目框掩藏
print EOT
--
___________________

尾部特殊编码
!--
EOT;
?
--
****************************
bencandy.htm
头顶部特殊编码
!--
?php
print EOT
--
尾部特殊编码
!--
EOT;
?
--
**********************************

收缩