分享
 
 
 

用GoLive实现CSS+DIV之一

王朝html/css/js·作者佚名  2006-11-24
窄屏简体版  字體: |||超大  

在可视化CSS编辑器方面,GoLive在版本6已经成型,其设计构思甚至成为许多专业CSS编辑器模仿的对象,如众所周知的TopStyle。近来随着中文版GoLive的发布,引发了业内网页制作软件之争。面对这个在国内几乎是一夜之间出现的新面孔,许多人开始关注。

我曾发表过有关GoLive将在网页制作方面取代DreamWeaver的评论,预计后者将转型为数据库开发组件。这是因为DreamWeaver在数据库方面非常优秀,但在可视化网页编辑方面早已落后(应该说不曾领先)。只是凭借着中文化优势占领着国内市场。

在CSS+DIV方式逐渐成为主流网页结构的今天,一款功能完善使用简单的CSS编辑器是非常必要的,并且应该融合到网页制软件之中,在这方面,GoLive领先同行软件至少两年。只是之前由于开发商不关注中文市场而一直不为人知。今天我们就来粗略看一下如何在GoLive中使用CSS编辑器。

1:CSS文件管理

GoLive默认是基于站点的软件,在建立新站点后将自动产生CSS目录及一个Basic.css文件。如下图。如果有多个CSS文件存在,加粗的文件为默认CSS文件。可在列表中右键点击CSS文件设为默认。

建立站点的视频教程:http://www.99ut.com/tutorial/golive/video/glv002.html (拥有视频源文件的站点可改为内部指向)

而新建的网页文件也将默认以链接方式使用这个外部CSS文件,这在源代码视图中可以看到。如下图。

对于已经打开处于编辑状态的页面,可长按编辑窗口右端红色箭头处的CSS编辑图标来选择更改外部CSS文件链接。如下图。

还可以在编辑窗口点击红色箭头处的标头区,然后选择其中绿色箭头处的外部CSS指示图标(删除该图标即脱离该外部CSS文件),然后在检查器〖CTRL_1〗调板中按住蓝色箭头处拖出定位线,定位到站点窗口的CSS文件名称上。

即使在页面文件未打开的情况下,也可以在站点窗口中选择文件(可多选),然后通过CSS调板来更改外部CSS文件链接,如下图就是为photo.html和story.html增加new1.css外部样式表的过程。此外还可以点击红色箭头处的按钮来增加。

若要脱离外部CSS样式文件,可在CSS调板中选择后点击红色箭头右方的垃圾桶图标。

2:在页面中应用样式

主要使用CSS调板〖CTRL_SHIFT_9〗来完成页面内容的样式指定。还可以使用快捷键〖CTRL_B〗开启浮动式CSS调板,每次操作之后浮动调板将消失。

如下图所示,指定的类型分为四种:内联样式(鼠标所选部分)、块样式(光标所在文字块)、p(光标所在段落)、body(全页面)。如果光标位于一个链接之上还将出现a(链接样式),选择表格或单元格后还将出现table(表格)和td(表格中的单元格)。

虽然完成指定后编辑窗口中将实时显示效果,GoLive还是提供了指定预览功能,鼠标在样式名称上悬停将出现浮动预览窗口(下图红框内即是),预览的内容包括应用效果和样式源代码。根据不同的指定类型,预览窗口中的应用效果也不同。如下图所示,在选择了GoLive CS2文字后,鼠标悬停于内联样式上,预览窗口就显示所选的文字内容。如果此时鼠标悬停于块样式上,预览窗口文字将显示为“GoLive CS2中文版”。

3:CSS编辑器

在站点窗口中双击css文件就可以开启样式编辑器。在开启的页面中点击右上角的CSS编辑按钮(本篇第3图所示)也可以开启编辑器。两者的区别在于前者是编辑外部样式文件,后者是编辑自身html样式表。

现在我们来看一下GoLive的样式编辑器,分为可视化编辑和提供给代码狂人使用的源代码(红色箭头处)两大视图。并提供了样式搜索器(绿色箭头处),这个看似简单的搜索其实非常全面,点击放大镜处可选择搜索的选项。

CSS内容可大致分为元素样式和自定义样式,元素样式的作用基本都是全局性的,如td将应用于页面中全部的单元格。而自定义样式(即类样式)可选择性地应用于页面的某个部分。在编辑窗口左方是样式列表,其中包含着元素样式和类样式,点击橙色箭头处可新建元素,点击紫色箭头处可新建类。

点击蓝色箭头处的两个按钮可将编辑窗口拆分为源代码或文本预览。此外在编辑的同时检查器调板〖CTRL_1〗也会出现文本预览。有关样式编辑器的其他设定可参考视频教程:http://www.99ut.com/tutorial/golive/video/glv023.html

在左方选择一个样式后,则可进入编辑状态,如下左图,共有7大项目:字体属性、文本属性、块属性、边距和填充、边框和外框、列表项目及其它、背景属性。默认为字体属性。相应属性如果被设定,将会在信息栏(红色箭头处)出现图标。

点击绿色箭头处将出现颜色调板,从中可以选取色彩。GoLive提供了很多专业的色板,如下右图就是著名的VisiBone配色表。

其他6类属性设定如下各图所示。

此外,GoLive可以从对象调板〖CTRL_2〗中使用CSS布局,如下图红色箭头处。从而实现CSS+DIV的网页结构。

建立了CSS布局后将产生相应的样式,可在页面的样式编辑器中进行设定。如下左图。可同时配合如下右图的表和框调板进行选择。

有关GoLive的CSS具体操作已做成视频教程,大家可通过文章前面的链接观看或访问http://www.99ut.com/tutorial,有关使用DIV布局的视频教程及GoLive文字教程将在近期制作。大家互相交流,共同进步。

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有