php编程基础与实例教程课件

PHP编程基础与实例教程PHP

Fundamentals

&

Practices主讲：孔祥盛第13章新闻发布系统的页面美工本章大纲JavaScript脚本语言FCKeditor在线编辑器新闻发布系统页面布局的实现新闻发布系统静态和动态页面的嵌入13-1

JavaScript脚本语言删除新闻信息前弹出用户确定对话框提供新闻编辑的撤销功能13-2

FCKeditor在线编辑器FCKeditor使用前的准备工作FCKeditor类的成员变量和成员方法FCKeditor类中的成员变量及功能public

$InstanceName：定义了在线编辑器的名称（例如：

content），该成员变量需要和FCKeditor类的构造方法一起使用才有意义。例如代码：$oFCKeditor=new

FCKeditor('content')构造了一个名称为content的在线编辑器，该在线编辑器的实例名为$oFCKeditor。在线编辑器的名称（content）类似于多行文本框表单控件textarea的名称；通过实例名（$oFCKeditor）可以访问FCKeditor实例中的其它成员变量，并可以调用FCKeditor类中的成员方法。13-2

FCKeditor在线编辑器FCKeditor使用前的准备工作FCKeditor类的成员变量和成员方法FCKeditor类中的成员变量及功能public

$BasePath：定义了FCKeditor的根目录，

FCKeditor的根目录实际上是fckeditor_php5.php文件和

fckconfig.js文件所在的目录。例如：$oFCKeditor->BasePath='fckeditor/'。public$Width：定义了在线编辑器实例的宽度（单位像素），例如：$oFCKeditor->Width=550。public$Height：定义了在线编辑器实例的高度（单位像素），例如：$oFCKeditor->Height=350。13-2

FCKeditor在线编辑器FCKeditor使用前的准备工作FCKeditor类的成员变量和成员方法FCKeditor类中的成员变量及功能public$Value：定义了在线编辑器的内容，一般对应于多行文本框表单控件textarea的值。例如代码：$oFCKeditor->Value="请在此输入新闻的内容！"。public$ToolbarSet：定义了在线编辑器实例的工具栏集合。默认情况下FCKeditor提供了Default和Basic工具栏集合，工具栏集合类似于Word窗口中的格式工具栏与常用工具栏。例如：$oFCKeditor->ToolbarSet="Default"或$oFCKeditor->ToolbarSet="Basic"。13-2

FCKeditor在线编辑器FCKeditor使用前的准备工作FCKeditor类的成员变量和成员方法FCKeditor类中的成员变量及功能public$Config：定义了在线编辑器的额外配置，$Config是一个数组，数组中的“键”来自于fckconfig.js文件中的

“属性名”。例如：$oFCKeditor->Config['EnterMode']=

'br'。13-2

FCKeditor在线编辑器FCKeditor使用前的准备工作FCKeditor类的成员变量和成员方法FCKeditor类中的成员方法public

function

_

_construct(

$instanceName

)：FCKeditor类的构造方法。需要和FCKeditor类的成员变量$InstanceName一起使用才有意义。public

function

CreateHtml()：返回某个在线编辑器实例的HTML代码。例如：$fckeditor

=

$oFCKeditor->CreateHtml()

;public

function

Create()：在网页上显示某个在线编辑器实例的HTML代码，例如：$oFCKeditor->Create();13-2

FCKeditor在线编辑器FCKeditor的高级配置修改语言配置修改皮肤配置添加中文字体设置回车键模式设置工具栏展开设置在线编辑器的文字颜色列表设置在线编辑器的文字字号列表

8．设置工具栏集合ToolbarSet

9．设置在线编辑器表情文件所在目录设置在线编辑器表情文件列表在线编辑器中表情按钮的其它设置13-2

FCKeditor在线编辑器4.FCKeditor在新闻发布系统中的应用<?phpinclude("fckeditor/fckeditor.php");//载入FCKeditor类文件$oFCKeditor=new

FCKeditor('content');//创建名称为content在线编辑器，实例名为$oFCKeditor$oFCKeditor->BasePath='fckeditor/';//设置FCKeditor实例的根目录$oFCKeditor->Width=550;//设置FCKeditor实例的宽度$oFCKeditor->Height=350;//设置FCKeditor实例的高度$oFCKeditor->Value="请在此输入新闻的内容！";//设置FCKeditor实例的内容$oFCKeditor->ToolbarSet="Default";//设置FCKeditor实例的工具栏集合$oFCKeditor->Config['EnterMode']='br';//设置FCKeditor实例的额外配置$oFCKeditor->Create();//显示在线编辑器的HTML代码?>13-2

FCKeditor在线编辑器FCKeditor的文件管理“文件浏览”功能的设置“快速文件上传”功能的设置中文乱码问题的解决文件管理的高级配置13-2

FCKeditor在线编辑器3.FCKeditor瘦身13-3新闻发布系统页面布局的实现DIV+CSS概述界面布局图13-3新闻发布系统页面布局的实现使用DIV实现页面布局准备图片素材13-3新闻发布系统页面布局的实现5.

CSS热身body{font:12px"宋体";text-align:center;}#container{}#header{}#menu{width:800px;height:74px;margin:0pxauto;no-repeat;}#banner{width:778px;height:177px;margin:0pxauto;background:url('../images/banner.jpg')no-repeat;}#pagebody{width:778px;height:500px;margin:0pxauto;#sidebar{width:163px;height:500px;float:left;background-color:#BDBDBD;#login{margin:10px

0px

0px

0px;}margin:0p#xm;

ainbody{background-color:#FtFeFxt;-align:left;width:610px;height:500px;float:right;width:800px;margin:0pxauto;

background-color:#D8D8D8;}#mainfunction{width:800px;

margin:10px

0px

0px}

10px;margin:0p}x

auto;#footer{width:778px;height:40px;margin:0pxauto;background-color:#F}

FCC00;backgroun}

d:url("../ima