viewInheritStyle Attribute | viewInheritStyle Property

  • Article

Sets or retrieves a value that indicates whether the document fragment inherits the Cascading Style Sheets (CSS) styles set in the primary document.

Syntax

[ bInherit = ] object.viewInheritStyle [ = v ]

Possible Values

bInherit Boolean that specifies or receives one of the following values.
true
Default. Document fragment inherits CSS styles.
false
Document fragment does not inherit CSS styles.

The property is read/write. The property has a default value of true.

DHTML expressions can be used in place of the preceding value(s). As of Internet Explorer 8, expressions are not supported in IE8 mode. For more information, see About Dynamic Properties.

Remarks

For more information on the CSS styles that can be inherited when viewInheritStyle is set to true, see About Viewlink CSS Inheritance. Inheritable CSS styles are only applied to elements in the document fragment that do not already have the corresponding CSS styles defined.

Examples

In the following sample a div tag contains a custom element that has an element behavior attached to it. The div tag that is located in the primary document sets a number of CSS attributes, specifically the following:

The content of the primary document is shown in the code snippet below.


<HTML xmlns:myns>
<HEAD>
<?import namespace="myns" implementation="viewInheritStyle.htc"> 
</HEAD>
<BODY>
<DIV style= "color:red;font-size:12pt;font-Style:italic;border:2px solid blue">
This text is inside a DIV element in the primary document.
<BR>
<!-- this is a custom element -->
<myns:abc></myns:abc>
</DIV>
</BODY>
</HTML>

The next code snippet shows the content of the HTML Component (HTC) file, viewInheritStyle.htc.

The HTC file contains a simple document fragment, which also includes a div tag that uses the following CSS styles.

  • fontSize is set to 20 pt.
  • border is set to 2px solid green.

Because the content in the primary document has CSS styles set on a div tag that contains the custom element, the div tag in the document fragment inherits the inheritable CSS Styles when the viewInheritStyle property is true.


<public:component tagName="abc">
<attach event="oncontentready" onevent=init() />
</public:component>
<script> 
function init(){
defaults.viewLink=document;
defaults.viewInheritStyle = false;
docFragCaption.innerText = "viewInheritStyle is now set to false";
}

function btnChangeInheritance_onClick(){
boolInherit = defaults.viewInheritStyle;

    if (boolInherit == true) {
    defaults.viewInheritStyle = false;
    docFragCaption.innerText = "viewInheritStyle is now set to false";
    }
    else
    {
    defaults.viewInheritStyle = true;
    docFragCaption.innerText = "viewInheritStyle is now set to true";
    }
}
</script>
<BODY>
<DIV id="docFragCaption" style= "font-size:20pt;border:2px solid green"></DIV>
<BR>
<INPUT id=btnChangeInheritance type=button value="Toggle viewInheritStyle property" onclick="btnChangeInheritance_onClick()">
</BODY>

Run the sample to verify that the inheritable CSS styles from the primary document are applied to the document fragment. In this example, the inherited CSS styles are the fontStyle and color properties.

In this example, the border property is not inherited for two reasons. First, the border property not an inheritable property, and second, the property is set explicitly on the div tag in the document fragment.

Standards Information

There is no public standard that applies to this property.

Applies To

defaults, HTCElementBehaviorDefaults Constructor

See Also

Introduction to Viewlink, About Viewlink CSS Inheritance, About Element Behaviors