tesia
- 浏览: 33425 次
- 性别:
- 来自: 广州
-
最新评论
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>改变文档样式风格示例</title>
<link rel="stylesheet" type="text/css" href="ext-4.2.1/resources/css/ext-all.css" />
<script type="text/javascript" src="ext-4.2.1/bootstrap.js"></script>
<script type="text/javascript" src="ext-4.2.1/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
var themes=[
{theme:'默认',css:'ext-all.css'},
{theme:'黑色',css:'ext-all-access.css'},
{theme:'灰色',css:'ext-all-gray.css'}
];
//创建主题数据模型
Ext.regModel('Theme',{
fields:['theme','css']
});
//创建主题数据源
var themeStore=Ext.create('Ext.data.Store',{
model:'Theme',
data:themes
});
//创建主题切换选择框
var themeChange=Ext.create('Ext.form.ComboBox',{
id:'themeChange',
width:150,
labelWidth:60,
labelSeparator:':',
fieldLabel:'样式选择',
store:themeStore,//
editable:false,
triggerAction:'all',//单击触发按钮时显示全部数据
//store:themeStore,//
displayField:'theme',
valueField:'css',
queryMode:'local',//本地模式
value:'ext-all.css',//默认风格
listeners:{
'collapse':function(){
//调用Ext.util.CSS.swapStyleSheet来替换其样式表路径
Ext.util.CSS.swapStyleSheet(displayField,'../../ext-4.2.1/resources/css/'+this.getValue());
contentIframe.window.themeChange(this.getValue());
}
}
});
Ext.create('Ext.form.FormPanel',{
title:'Ext.form.ComboBox',
renderTo:Ext.getBody(),
bodyPadding:5,
frame:true,
height:100,
width:270,
defaults:{
labelSeparator:':',
labelWidth:70,
width:200,
labelAlign:'left'
},
items:themeChange
});
});
</script>
</head>
<body>
</body>
</html>
PS：貌似路径出了问题。没有得到想要的效果
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>改变文档样式风格示例</title>
<link rel="stylesheet" type="text/css" href="ext-4.2.1/resources/css/ext-all.css" />
<script type="text/javascript" src="ext-4.2.1/bootstrap.js"></script>
<script type="text/javascript" src="ext-4.2.1/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
var themes=[
{theme:'默认',css:'ext-all.css'},
{theme:'黑色',css:'ext-all-access.css'},
{theme:'灰色',css:'ext-all-gray.css'}
];
//创建主题数据模型
Ext.regModel('Theme',{
fields:['theme','css']
});
//创建主题数据源
var themeStore=Ext.create('Ext.data.Store',{
model:'Theme',
data:themes
});
//创建主题切换选择框
var themeChange=Ext.create('Ext.form.ComboBox',{
id:'themeChange',
width:150,
labelWidth:60,
labelSeparator:':',
fieldLabel:'样式选择',
store:themeStore,//
editable:false,
triggerAction:'all',//单击触发按钮时显示全部数据
//store:themeStore,//
displayField:'theme',
valueField:'css',
queryMode:'local',//本地模式
value:'ext-all.css',//默认风格
listeners:{
'collapse':function(){
//调用Ext.util.CSS.swapStyleSheet来替换其样式表路径
Ext.util.CSS.swapStyleSheet(displayField,'../../ext-4.2.1/resources/css/'+this.getValue());
contentIframe.window.themeChange(this.getValue());
}
}
});
Ext.create('Ext.form.FormPanel',{
title:'Ext.form.ComboBox',
renderTo:Ext.getBody(),
bodyPadding:5,
frame:true,
height:100,
width:270,
defaults:{
labelSeparator:':',
labelWidth:70,
width:200,
labelAlign:'left'
},
items:themeChange
});
});
</script>
</head>
<body>
</body>
</html>
PS：貌似路径出了问题。没有得到想要的效果
分享到：
发表评论
-
Ext.data.TreeStore 分级异步加载树节点示例
2013-07-10 15:36 2074Ext.data.TreeStore远程加载树节点有两种常用方 ... -
Ext.Ajax.request提交JSON数据
2013-07-10 09:29 1368JSON作为轻量级的数据传输格式，在很多时候可以作为XML文件 ... -
Ext.Ajax.request提交XML数据示例
2013-07-09 16:51 948服务器端：loginServerXml.jsp 在lib下要有 ... -
Ext.Ajax.request异步提交表单示例
2013-07-09 16:10 1048服务器端代码：loginServer.jsp <%@ ... -
树形面板Ext.tree.Panel
2013-07-05 15:19 648<!DOCTYPE html PUBLIC " ... -
relayEvents传播分发事件
2013-07-04 14:17 696<!DOCTYPE html PUBLIC " ... -
Extjs自定义事件
2013-07-04 10:54 436<!DOCTYPE html PUBLIC " ... -
ExtJS事件绑定方式示例
2013-07-04 10:55 673<!DOCTYPE html PUBLIC " ... -
Ext.util.JSON编码和解码JSON对象
2013-07-03 15:27 944<script type="text/java ... -
Ext.util.Format提供的常用格式化方法
2013-07-03 14:57 1334<!DOCTYPE html PUBLIC " ... -
Ext.util.ClickRepeater 事件的配置和触发
2013-07-03 11:55 748Ext.util.ClickRepeater 继承Ext.ut ... -
样式表的创建和规则获取示例
2013-07-03 10:44 517<!DOCTYPE html PUBLIC " ... -
Ext.KeyNav为元素提供简单的按键处理方法示例
2013-07-03 09:46 849<!DOCTYPE html PUBLIC " ... -
Ext常用函数
2013-07-01 16:42 629函数一：Ext.onReady（） Ext的Dom都是动态生成 ... -
水平盒布局HBox
2013-07-01 15:43 486<!DOCTYPE html PUBLIC " ... -
表格布局
2013-07-01 15:18 523<!DOCTYPE html PUBLIC " ... -
Ext.layout.container.Column布局
2013-07-01 15:18 756<script type="text/java ... -
Absolute绝对位置布局示例
2013-07-01 14:35 396Ext.layout.container.Absolute对应 ... -
Card 卡片式布局
2013-06-28 16:40 951<!DOCTYPE html PUBLIC " ... -
Ext.layout.container 标准布局类
2013-06-28 15:48 768<!DOCTYPE html PUBLIC " ...
相关推荐
7. **自定义主题**：layui允许用户自定义主题，通过修改CSS变量即可改变整个框架的颜色风格，满足个性化需求。 8. **兼容性**：layui兼容大部分现代浏览器，包括Chrome、Firefox、Safari、Edge以及IE9及以上版本，...
Ruby-Hologram是一个开源工具，专门用于创建基于Markdown的文档系统风格指南。这个工具的核心功能是解析CSS文件中的注释，然后将这些注释转换成一个美观、组织有序的在线风格指南，使得开发者和设计师可以方便地查阅...
7. **文档和社区支持**：PrimeUI 提供详细的文档，包括 API 参考、示例代码和常见问题解答。此外，开发者可以通过官方论坛和社区获取帮助，与其他开发者交流经验。 总之，PrimeUI 是一个强大的 UI 工具，可以帮助...
根据提供的文档标题“TeX-文档类别和页面风格.pdf”及其描述和部分内容，我们可以总结出以下相关的IT知识要点，特别是关于TeX和LaTeX中文档类别与页面样式的详细内容。 ### TeX与LaTeX简介 TeX 和 LaTeX 是由 ...
- **主题**：jsTree支持更换主题，改变节点的外观和风格，满足不同设计需求。 - **自定义**：可以通过CSS和JavaScript自定义节点的样式、图标以及交互行为。 6. **性能优化** - **懒加载**：对于大型数据集，...
通过设置样式，可以极大地简化格式化过程，确保整个文档风格统一。 2. **应用样式**：通过【格式】>【样式和格式】命令，可以在任务窗格中选择和应用样式。Word提供了多种预设样式，如标题1、标题2等，可以根据需要...
5. **readm.txt文件**：这个文件可能是关于如何使用这个样式库的说明文档，通常包含安装步骤、使用示例以及可能的注意事项。阅读这个文件对理解如何集成和使用这些样式至关重要。 6. **themes目录**：这个目录很...
首先，CSS（Cascading Style Sheets）是用于描述HTML或XML（包括如SVG、MathML等各种XML方言）文档样式的样式表语言。在网页开发中，CSS起着至关重要的作用，它允许开发者将内容与表现分离，使得页面布局和设计更为...
5. **图表样式和主题**：软件内置多种风格和颜色主题，用户可以快速改变整个图表的视觉效果，使其符合企业风格或个人喜好。 6. **协作与共享**：Visio 2003支持版本控制和评论功能，便于团队成员之间的协作。文件...
然而，在尝试通过样式表（QSS，Qt Style Sheets）来改变`QWidget`及其子类的外观时，有时会遇到一些问题，特别是当直接对`QWidget`派生的类应用样式表时，可能无法达到预期效果。本篇将深入探讨这个问题以及解决方案...
QT QSS样式示例及说明 QT框架提供了一种强大的机制来实现用户界面的美观设计，这就是QSS（Qt Style Sheet）。QSS类似于HTML中的CSS，允许开发者通过类似CSS的语法来定义Qt控件的外观和感觉。这篇文档将深入探讨QSS...
综上所述，这个压缩包为想要创建游戏风格设计的Photoshop用户提供了一系列实用的字体样式资源和示例。通过学习和运用这些素材，设计师不仅可以提高工作效率，还能在设计中创造出引人入胜的游戏氛围。同时，提供的...
- **CSS自定义**：学习如何通过修改或扩展EasyUI的默认样式，使界面符合项目的整体风格。 - **性能优化**：了解如何减少HTTP请求，合并CSS和JS文件，以及利用EasyUI的异步加载特性，提高页面加载速度。 通过研究这...
4. **主题定制**：ElementPlus支持自定义主题，允许开发者通过修改SCSS变量来改变组件的颜色、尺寸等视觉样式，以适应不同的品牌风格。 5. **国际化支持**：ElementPlus提供多语言支持，方便开发多语言应用。 6. *...
这些按钮通常具有半透明（或称为alpha通道）效果、动态阴影、以及在鼠标悬停时改变颜色或形状的特性。为了在C#中实现这样的效果，我们需要利用.NET Framework提供的Windows Presentation Foundation (WPF) 或者...
3. **主题定制**：jPlayer 允许用户自定义 CSS 样式，轻松改变播放器的外观和布局，适应不同的网站设计需求。 4. **API 控制**：通过 JavaScript API，开发者可以实现对播放、暂停、音量控制、进度调整等播放器功能...
标签“XP风格”进一步强调了这个工具的主要功能，即改变程序的视觉样式，使其与Windows XP的用户界面相匹配。这包括窗口边框、按钮、菜单、控件等元素的样式调整。 尽管Windows XP操作系统已不再主流，但在某些特定...
2. **自定义样式**：开发者可以根据需求调整菜单的外观，包括颜色、字体、边框等，以适应应用程序的整体风格。 3. **事件处理**：该类支持添加事件处理器，以便在用户与菜单交互时执行特定操作，如点击菜单项后打开...
10. **样式表与主题**：探讨如何使用QSS（Qt StyleSheet）来改变应用的外观和风格。 11. **事件处理**：说明事件和事件过滤器的工作原理，以及如何响应用户的输入和系统的事件。 12. **示例代码与实践**：提供多个...
本文档详细介绍了BeaPortal门户的体系结构、布局样式文件的结构及其使用方法。通过学习这些内容，读者可以更好地理解如何构建和定制BeaPortal门户的布局和样式。无论是对于初学者还是有经验的开发者来说，这些知识点...