`
piperzero
  • 浏览: 3466519 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
文章分类
社区版块
存档分类
最新评论

AJAX里TabContainer的CSS (转贴)

阅读更多

AJAX自从引进了Tab,着实让我开心了一番。但是,在调整Tab的样式的时候,也着实让我吃了一惊。
于是,抱着没有困难也要制造困难的原则,开始了征途:
按照Tab作者Ronald Buckton所说,Tab的CSS包含如下几个类:
(1).ajax__tab_header: A container element that wraps all of the tabs at the top of the TabContainer.
(2).ajax__tab_outer:An outer element of a tab,often used to set the left-side background image of the tab.
(3).ajax__tab_inner:An inner element of a tab,often used to set the right-side image of the tab.
(4).ajax__tab_tab:An element of a tab that contains the text content.
(5).ajax__tab_body:A container element that wraps the area where a TabPanel is displayed.
(6).ajax__tab_hover:This is applied to a tab when the mouse is hovering over.
(7).ajax__tab_active:This is applied to a tab when it is the currently selected tab.

我画了个简图,当然,鼠标放上去(.ajax__tab_hover),和当前Tab(.ajax__tab_active)的那个就没画上去。

层次关系如图所示,弄清楚这个层次关系,对设计Tab样式有很大帮助。

分享到:
评论

相关推荐

    Ajax TabContainer 自定义CSS样式 .txt

    Ajax TabContainer 自定义CSS样式 .txtAjax TabContainer 自定义CSS样式 .txtAjax TabContainer 自定义CSS样式 .txt

    AjaxControlToolkit之TabContainer(自定义样式)

    介绍了如何自定义TabContainer的CSS样式。主要CSS样式已经写明。使用VS2008 .Net3.5环境。

    js写的tabcontainer选项卡

    选项卡,效果类似于dojo的tabcontainer

    TabContainer样式

    AjaxControlTookit中应用TabContainer,选项卡的样式有的时候需要修改,其实很简单,看如下代码

    第十个范例——布局之TabContainer

    博文链接:https://lwj9922.iteye.com/blog/146573

    asp.net AjaxControlToolKit–TabContainer控件的介绍

    在AJAX Control Tool Kit的控件中有TabContainer控件,它是一些TabPanel控件的载体,而每个TabPanel可以像标准的Panel控件一样,成为其它一些ASP.NET控件的容器。TabPanel通过它的三部分结构HeaderText, HeaderTemplate...

    asp.net AjaxControlToolKit--TabContainer控件的介绍

    ModalPopup控件允许一个asp页面的部分内容以对话框的模式显示给用户,同时会限制用户于页面的其他部分交互。对话框显示的内容可以是一个层级,这个层级的背景可以使用户自定义的格式,简单的理解好比是一个对话框弹出来...

    如何在SharePoint2010中整合使用AjaxControlToolKit

    已驗證可以成功讓 SharePoint 2010 使用 ...AjaxToolControlKit 提供許多控制項(例如: Ajax TabContainer 就是 Asp.Net 沒有的控制項) 另外,AjaxToolControlKit 提供的 ScriptManager 比 Asp.Net 預設的效能更強大。

    dojo精品中文教程(包一)

    Dojo学习笔记--TabContainer Dojo学习笔记--ValidationTextbox Dojo学习笔记--dijit.Dialog Dojo学习笔记--dijit.Menu Dojo学习笔记--dijit.TitlePane Dojo学习笔记--dijit.Tooltip Dojo学习笔记--dijit.Tree ...

    dojo精品中文教程(全)

    分三个包上传时,第三个包好像传不上去,我给整合了一下,打在一个包里上传了! dojo精品中文教程 Dojo.1.0 Practice Note [1] 什么是dojo 选择dojo的理由 AJAX架构之Dojo篇 Adding Ajax中文版 (DoJo) DOJO...

    dojo精品中文教程(包二)

    Dojo学习笔记--TabContainer Dojo学习笔记--ValidationTextbox Dojo学习笔记--dijit.Dialog Dojo学习笔记--dijit.Menu Dojo学习笔记--dijit.TitlePane Dojo学习笔记--dijit.Tooltip Dojo学习笔记--dijit.Tree ...

    dojo精品中文教程(包三)

    Dojo学习笔记--TabContainer Dojo学习笔记--ValidationTextbox Dojo学习笔记--dijit.Dialog Dojo学习笔记--dijit.Menu Dojo学习笔记--dijit.TitlePane Dojo学习笔记--dijit.Tooltip Dojo学习笔记--dijit.Tree ...

    解析6种ASP.NET跨页面传值的方法

    解析6种ASP.NET跨页面传值的方法,大家都知道跨页面问题比较麻烦的。这里有六种,总有适合你的。不过跨页面不是跨域哈

    MintUI tab-container.vue左右切换

    import { TabContainer, TabContainerItem, Cell } from "mint-ui"; export default { name: "exam-paper", components: { mtTabContainer: TabContainer, mtTabContainerItem: TabContainerItem, Cell }, ...

    ajaxtoolkit中Tab控件的例子

    Tab本身就应该是个以页签形式显示组织网页内容的一个控件...在AJAX Control Tool Kit的控件中有TabContainer控件,它是一些TabPanel控件的载体,而每个TabPanel可以像标准的Panel控件一样,成为其它一些ASP.NET控件的容器

Global site tag (gtag.js) - Google Analytics