E.2 Style Element Classes Used with Oracle Portal Styles

If you plan to apply your own cascading style sheet (CSS) to your portal pages or to include Oracle Portal-specific style classes in an HTML template, it will be useful to know the style element classes used by Oracle Portal styles to define the look and feel of every portal object.

This section provides a series of tables that list and describe the style element classes associated with Oracle Portal styles. It includes the following subsections:

For information on how to include style element classes or a CSS with Oracle Portal pages, see Section 11.12, "Using Portal Style Element Classes in HTML Templates and CSSs"

E.2.1 Style Element Classes Associated with Common Elements

Table E-2 lists and describes style element classes associated with the common elements defined in an Oracle Portal style.

Where variables are indicated, the following applies:

  • idn is an internally generated number that identifies the style in use.

  • siteidnn, is an internally generated number that identifies the page group.

If you plan to use Oracle Portal style element classes, consider always setting your page style to Main. This way, the values for idnsiteidnn are predictable. That is: id1siteid0.

Table E-2 Style Element Classes Associated with Common Elements

Style Element Description/Example

Bodyidnsiteidnn

The color or image used for the background of the page or region

.Bodyid1siteid0{Background-Color:#FFFFFF;}

RegionHeaderidnsiteidnn

The color, height, and alignment of text in the banners that display above each region in a page

.RegionHeaderid1siteid0{Background-Color:#336699;
Height:20;Text-Align:Left;}

RegionHeaderTextidnsiteidnn

The color, font face, font size, font style, and font decoration of regular text in the banners that display above each region in a page

.RegionHeaderTextid1siteid0{Color:#FFFFFF;
Font-Family:Arial,Helvetica;Font-Size:0.75em;
Font-Weight:Bold;}

RegionNoBorder

Determines what to display when no border is selected (usually set to nothing)

RegionNoBorder{}

RegionBorder

The color, width, and style of the table border that is used to display a region

.RegionBorder{border:#336699  1px solid;}

RegionHeaderColor

The color, background color, width, and style of the table and border that is used to display a region header

.RegionHeaderColor{background-color:;
border:#336699 0px solid;}

PageColor

The background color of a page

.PageColor{background-color:#FFFFFF}

LeftCurve

The image and image position of the left side of a region header

.LeftCurve{Background-Attachment:scroll;
Background-Image:url(https://company.us.myco.com:5555/images/FFFFFFl.gif);
Background-Position:left top;
Background-Repeat:no-repeat;}

RightCurve

The image and image position of the right side of a region header

.RightCurve{Background-Attachment:scroll;
Background-Image:url(https://company.us.myco.com:5555/images/FFFFFFr.gif);
Background-Position:right top;
Background-Repeat:no-repeat;}

E.2.2 Style Element Classes Associated with Tabs

Table E-3 lists and describes style element classes associated with the tab elements defined on an Oracle Portal style sheet.

Where variables are indicated, the following applies:

  • idn is an internally generated number that identifies the style in use.

  • siteidnn, is an internally generated number that identifies the page group.

If you plan to use a CSS with your Oracle Portal pages, consider always setting your page style to Main. This way, the values for idnsiteidnn are predictable. That is: id1steid0.

Table E-3 Style Element Classes Associated with Tabs

Style Element Description/Example

LeftSubTabidnsiteidnn

LeftTabForeSlantidnsiteidnn

RightSubTabidnsiteidnn

RightTabForeCurveidnsiteidnn

TabForegroundColoridnsiteidnn

The color and images of an active main or sub-tab

The active tab is the tab that is currently selected.

.LeftSubTabid1siteid0
{Background-Attachment:scroll;
Background-Color:#336699;
Background-Image:url(https://mycompany.us.myco.com:5555/images/FFFFFFsl.gif);
Background-Position:left top;
Background-Repeat:no-repeat;}
.LeftTabForeSlantid1siteid0
{Background-Attachment:scroll;
Background-Color:#336699;
Background-Image:url(https://mycompany.us.myco.com:5555/images/FFFFFFtl.gif);
Background-Position:left top;
Background-Repeat:no-repeat;}
.RightSubTabid1siteid0
{Background-Attachment:scroll;
Background-Color:#336699;
Background-Image:url(https://mycompany.us.myco.com:5555/images/FFFFFFsr.gif);
Background-Position:right top;
Background-Repeat:no-repeat;}

.RightTabForeCurveid1siteid0
{Background-Attachment:scroll;
Background-Color:#336699;
Background-Image:url(https://mycompany.us.myco.com:5555/images/FFFFFFtr.gif);
Background-Position:right top;
Background-Repeat:no-repeat;}
.TabForegroundColorid1siteid0
{Background-Color:#336699;}

TabForegroundTextidnsiteidnn

The color, font face, font size, font style, and font decoration of the text on the active tab

The active tab is the tab that is currently selected.

.TabForegroundTextid1siteid0{Color:#FFFFFF;
Text-Decoration:none;
Font-Family:Arial, Helvetica;
Font-Size:0.92em;Font-Weight:Bold;}

LeftTabBgSlantidnsiteidnn

RightTabBgCurveidnsiteidnn

SubTabBgTextidnsiteidnn

TabBackgroundColoridnsiteidnn

The color and images to use for inactive main or sub-tabs

Inactive tabs are the tabs that are not currently selected.

.LeftTabBgSlantid1siteid0
{Background-Attachment:scroll;
Background-Color:#CCCC99;
Background-Image:url(https://mycompany.us.myco.com:5555/images/FFFFFFtl.gif);
Background-Position:left top;
Background-Repeat:no-repeat;}
.RightTabBgCurveid1siteid0
{Background-Attachment:scroll;
Background-Color:#CCCC99;
Background-Image:url(https://mycompany.us.myco.com:5555/images/FFFFFFtr.gif);
Background-Position:right top;
Background-Repeat:no-repeat;}
.SubTabBgTextid1siteid0{Color:#CCCC99;
Text-Decoration:none;
Font-Family:Arial, Helvetica;
Font-Size:0.92em;}
.TabBackgroundColorid1siteid0
{Background-Color:#CCCC99;}

TabBackgroundTextidnsiteidnn

The color, font face, font size, font style, and font decoration of the text on inactive tabs

Inactive tabs are the tabs that are not currently selected.

.TabBackgroundTextid1siteid0{Color:#003366;
Text-Decoration:none;
Font-Family:Arial, Helvetica;
Font-Size:0.92em;}

E.2.3 Style Element Classes Associated with Items

Table E-4 lists and describes style element classes associated with the item elements defined on an Oracle Portal style sheet.

Where variables are indicated, the following applies:

  • idn is an internally generated number that identifies the style in use.

  • siteidnn, is an internally generated number that identifies the page group.

If you plan to use a CSS with your Oracle Portal pages, consider always setting your page style to Main. This way, the values for idnsiteidnn are predictable. That is: id1steid0.

Many of the item-related style element classes provide style definitions for Oracle Portal attributes. For a list and description of those attributes, see Section A.2, "Base Attributes".

Table E-4 Style Element Classes Associated with Items

Style Element Description/Example

GroupHeaderidnsiteidnn

The color, height, and alignment of text in the banners that appear above each group of items in a page

.GroupHeaderid1siteid0
{Background-Color:#336699;
Height:20;Text-Align:left;}

GroupHeaderTextidnsiteidnn

The color, font face, font size, font style, and font decoration of regular (non-linked) text in the banners that appear above each group of items in a page

.GroupHeaderTextid1siteid0{Color:#FFFFFF;
Font-Family:Arial, Helvetica;Font-Size:0.75em;
Font-Weight:Bold;Text-Decoration:none;}

GroupHeaderLinkidnsiteidnn

The color, font face, font size, font style, and font decoration of links in the banners that appear above each group of items in a page

.GroupHeaderLinkid1siteid0{Color:#FFFFFF;
Font-Family:Arial, Helvetica;Font-Size:0.75em;
Font-Weight:Bold;Text-Decoration:none;}

defaultattributeidnsiteidnn

The color, font face, font size, font style, and font decoration of any attribute that is not explicitly listed as a style element property for items

.defaultattributeid1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

subpagetitleidnsiteidnn

The color, font face, font size, font style, and font decoration of the sub-page Display Name attribute

.subpagetitleid1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

itemfunctionidnsiteidnn

The color, font face, font size, font style, and font decoration of the Associated Functions attribute

.itemfunctionid1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

authoridnsiteidnn

The color, font, font face, font size, font style, and font decoration of the Author attribute

.authorid1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em; Text-Decoration:none;}

wwsbr_itemtype_idnsiteidnn

The color, font face, font size, font style, and font decoration of the Base Item Type attribute

.wwsbr_itemtype_id1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

wwsbr_category_idnsiteidnn

The color, font face, font size, font style, and font decoration of the Category attribute

.wwsbr_category_id1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

wwsbr_updatedate_idnsiteidnn

The color, font face, font size, font style, and font decoration of the Date Updated attribute

.wwsbr_updatedate_id1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

wwsbr_updator_idnsiteidnn

The color, font face, font size, font style, and font decoration of the Last Updated By attribute

.wwsbr_updator_id1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

wwsbr_page_idnsiteidnn

The color, font face, font size, font style, and font decoration of the page Display Name attribute

.wwsbr_page_id1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

wwsbr_pagegroup_idnsiteidnn

The color, font face, font size, font style, and font decoration of the page group Display Name attribute

.wwsbr_pagegroup_id1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

wwsbr_publishdate_idnsiteidnn

The color, font face, font size, font style, and font decoration of the Publish Date attribute

.wwsbr_publishdate_id1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

createdateidnsiteidnn

The color, font face, font size, font style, and font decoration of the Create Date attribute

.createdateid1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

creatoridnsiteidnn

The color, font face, font size, font style, and font decoration of the Creator attribute

.creatorid1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

descriptionidnsiteidnn

The color, font face, font size, font style, and font decoration of the Description attribute

.descriptionid1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

titleidnsiteidnn

The color, font face, font size, font style, and font decoration of the item Display Name attribute

.titleid1siteid0{Color:#000000;
Font-Family:Arial,Helvetica;Font-Size:0.67em;
Font-Weight:Bold;Text-Decoration:none;}

titleorimageidnsiteidnn

The color, font face, font size, font style, and font decoration of the Link - Image OR Display Name attribute

.titleorimageid1siteid0{Color:#336699;
Font-Family:Arial, Helvetica;Font-Size:0.75em;
Font-Weight:Bold;Text-Decoration:none;}

documentsizeidnsiteidnn

The color, font face, font size, font style, and font decoration of the document size attribute

.documentsizeid1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

expiredateidnsiteidnn

The color, font face, font size, font style, and font decoration of the expire date attribute

expiredateid1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

inplacedisplayidnsiteidnn

The color, font face, font size, font style, and font decoration of the item content attribute

.inplacedisplayid1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

keywordsidnsiteidnn

The color, font face, font size, font style, and font decoration of the keywords attribute

.keywordsid1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;}

perspectivesidnsiteidnn

The color, font face, font size, font style, and font decoration of the perspective attribute

.perspectivesid1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Text-Decoration:none;}

scoreidnsiteidnn

The color, font face, font size, font style, and font decoration of the score attribute

.scoreid1siteid0{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;}

E.2.4 Style Element Classes Associated with Portlets

Table E-5 lists and describes style element classes associated with the portlet elements defined on an Oracle Portal style sheet.

Table E-5 Style Element Classes Associated with Portlets

Style Element Description

PortletHeaderColor

The color of portlet headers

.PortletHeaderColor{Background-Color:#336699;}

PortletHeaderText

The color, font face, font size, font style, and font decoration of regular (non-linked) text in portlet headers

.PortletHeaderText{Color:#FFFFFF;
Font-Family:Arial, Helvetica;Font-Size:0.83em;
Font-Weight:Bold;Text-Decoration:none;}

PortletHeaderLink

The color, font face, font size, font style, and font decoration of links in portlet headers

.PortletHeaderLink{Color:#FFFFFF;
Font-Family:Arial, Helvetica;Font-Size:0.67em;}

PortletHeaderStyle

Determines whether portlet headers have square or rounded edges

.PortletHeaderStyle{}

PortletSubHeaderColor

The color of portlet subheaders

.PortletSubHeaderColor{Background-Color:#EEEEDD;}

PortletSubHeaderText

The color, font face, font size, font style, and font decoration of regular (non-linked) text in portlet sub-headers

.PortletSubHeaderText{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.75em;}

PortletSubHeaderLink

The color, font face, font size, font style, and font decoration of links in portlet sub-headers

.PortletSubHeaderLink{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.75em;}

PortletBodyColor

The color of the main body of portlets

.PortletBodyColor{}

PortletHeading1

The color, font face, font size, font style, and font decoration of text in portlets marked with the PortletHeading1 tag

.PortletHeading1{Color:#336699;
Font-Family:Arial, Helvetica;Font-Size:0.75em;
Font-Weight:Bold;Text-Decoration:none;}

PortletText1

The color, font face, font size, font style, and font decoration of text in portlets marked with the PortletText1 tag

.PortletText1{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;}

PortletHeading2

The color, font face, font size, font style, and font decoration of text in portlets marked with the PortletHeading2 tag

.PortletHeading2{Color:#336699;
Font-Family:Arial, Helvetica;Font-Size:0.67em;
Font-Weight:Bold;}

PortletText2

The color, font face, font size, font style, and font decoration of text in portlets marked with the PortletText2 tag

.PortletText2{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.67em;}

PortletHeading3

The color, font face, font size, font style, and font decoration of text in portlets marked with the PortletHeading3 tag

.PortletHeading3{Color:#336699;
Font-Family:Arial, Helvetica;Font-Size:0.58em;
Font-Weight:Bold;}

PortletText3

The color, font face, font size, font style, and font decoration of text in portlets marked with the PortletText3 tag

.PortletText3{Color:#000000;Font-Family:Arial, Helvetica;Font-Size:0.58em;Text-Decoration:none;}

PortletHeading4

The color, font face, font size, font style, and font decoration of text in portlets marked with the PortletHeading4 tag

.PortletHeading4{Color:#336699;
Font-Family:Arial, Helvetica;Font-Size:0.58em;
Font-Weight:Bold;}

PortletText4

The color, font face, font size, font style, and font decoration of text in portlets marked with the PortletText4 tag

.PortletText4{Color:#000000;
Font-Family:Arial, Helvetica;Font-Size:0.58em;}