Is There Anything That Can T Be Replaced By Style Sheets?
Quite a bit actually. Style sheets only specify information that controls display and rendering information. Virtual style elements that convey the NATURE of the content can not be replaced by style sheets, and hyperlinking and multimedia object insertion is not a part of style sheet functionality at all (although controlling how those objects appear IS part of style sheets functionality.) The CSS1specification has gone out of its way to absorb ALL of the HTML functionality used in controlling display and layout characteristics. For more information on the possible properties in CSS, see the Index DOT Css Property Index.
Rule of Thumb: if an HTML element or attribute gives cues as to how its contentsshould be displayed, then some or all of its functionality has been absorbed by stylesheets.
Why Is My External Stylesheet Not Working ?
There may be several different reasons behind that, but one very common mistake is to have an external stylesheet that contains HTML markup in some form.
An external stylesheet must contain only CSS rules, and if required, correctly formed CSS comments; never include any HTML syntax, such as <style type="text/css">…
CSS comments are defined as anything that is placed between
/* (the comment start mark) and
*/ (the comment end mark). I.e. as follows…
/* This text right here is a correct CSS comment */
CSS comments may span multiple lines in the stylesheet. Nesting of CSS comments is not allowed.
Another reason for external stylesheets (and even embedded and inline stylerules) not to function as expected may be that you have tried to make use of some CSS-features that are not supported in the browser you are using.
External stylesheets shall also be served from the www-server with a MIME-type of 'text/css' in its 'Content Type:' HTTP header.
You may need to negotiate with your server admin to add this MIME type to your server if you are not able to configure the server yourself.
How Do I Quote Font Names In Quoted Values Of The Style Attribute?
The attribute values can contain both single quotes and double quotes as long as they come in matching pairs. If two pair of quotes are required include single quotes in double ones or vice versa
<P STYLE="font-family: 'New Times Roman'; font-size: 90%">
<P STYLE='font-family: "New Times Roman"; font-size: 90%'>
It's been reported the latter method doesn't work very well in some browsers, therefore the first one should be used.
Which Property Is Used To Control The Position Of An Image In The Background?
The background-position property is used to control the position of an image in the background.
Which Property Is Used To Increase Or Decrease The Size Of A Font?
The font-size property is used to increase or decrease the size of a font.
What Does The Cascading In Cascading Style Sheets Mean?
Style Sheets allow style information to be specified from many locations. Multiple (partial) external style sheets can be referenced to reduce redundancy, and both authors as well as readers can specify style preferences.
In addition, three main methods can be employed by an author to add style information to HTML documents, and multiple approaches for style control are available in each of these methods. In the end, style can be specified for a single element using any, or all, of these methods.
Why Use Style Sheets?
Style sheets allow a much greater degree of layout and display control than has ever been possible thus far in HTML. The amount of format coding necessary to control display characteristics can be greatly reduced through the use of external style sheets which can be used by a group of documents. Also, multiple style sheetscan be integrated from different sources to form a cohesive tapestry of styles for a document. Style sheets are also backward compatible - They can be mixed with HTML styling elements and attributes so that older browsers can view content as intended.
How Do I Get Rid Of The Gap Under My Image?
Images are inline elements, which means they are treated in the same way as text. Most people kind of know this - they know that if you use 'text-align:center' on an image it will be centred. What many people don't realise is that this means you will have a gap underneath an image. This gap is for the descenders of letters like j,q,p,y and g. To get rid of this gap you need to make the image block-level - like this
CSS
img {display:block;}
One problem that this can cause is when you want to have a few images next to each other - if they are block-level, they won't be next to each other. To get around that, you can use float:left. Of course, this might present another problem - maybe you don't want the image to float left. In this case, you can use an unordered list like this
CSS
ul, li {
list-style-type:none;
padding:0;
margin:0 auto;
}
ul {
width:150px;
}
li {
float:left;
}
HTML
<ul>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
</ul>
Styles Not Showing?
There are different ways to apply CSS to a HTML document with a stylesheet, and these different ways can be combined
* inline (internal) (Deprecated for XHTML)
* embedded (internal)
* linked (external) and
* @import (external)
Note: An external stylesheet is a text file that contains only CSS Styles. HTML comments are not supposed to be in there and can lead to misinterpretation (> is the CSS "Child" selector!).
Are Style Sheets Case Sensitive?
No. Style sheets are case insensitive. Whatever is case insensitive in HTML is also case insensitive in CSS. However, parts that are not under control of CSS like font family names and URLs can be case sensitive - IMAGE.gif and image.gif is not the same file.
What Is Cascade?
Cascade is a method of defining the weight (importance) of individual styling rules thus allowing conflicting rules to be sorted out should such rules apply to the sameselector.
Declarations with increased weight take precedence over declaration with normal weight
P {color: white ! important} /* increased weight */
P (color: black} /* normal weight */
What Is Important Declaration?
Important declaration is a declaration with increased weight. Declaration with increased weight will override declarations with normal weight. If both reader's and author's style sheet contain statements with important declarations the author's declaration will override the reader's.
BODY {background: white ! important; color: black}
In the example above the background property has increased weight while the color property has normal.
What Is Css Declaration?
CSS declaration is style attached to a specific selector. It consists of two parts; property which is equivalent of HTML attribute, e.g. text-indent: and value which is equivalent of HTML value, e.g. 10pt. NOTE: properties are always ended with a colon.
What Is Class Selector?
Class selector is a "stand alone" class to which a specific style is declared. Using the CLASS attribute the declared style can then be associated with any HTML element. The class selectors are created by a period followed by the class's name. The name can contain characters a-z, A-Z, digits 0-9, period, hyphen, escaped characters, Unicode characters 161-255, as well as any Unicode character as a numeric code, however, they cannot start with a dash or a digit. (Note: in HTML the value of the CLASS attribute can contain more characters).It is a good practice to name classes according to their function than their appearance.
.footnote {font: 70%} /* class as selector */
<ADDRESS CLASS=footnote/>This element is associated with the CLASS footnote</ADDRESS>
<P CLASS=footnote>And so is this</P>
Quite a bit actually. Style sheets only specify information that controls display and rendering information. Virtual style elements that convey the NATURE of the content can not be replaced by style sheets, and hyperlinking and multimedia object insertion is not a part of style sheet functionality at all (although controlling how those objects appear IS part of style sheets functionality.) The CSS1specification has gone out of its way to absorb ALL of the HTML functionality used in controlling display and layout characteristics. For more information on the possible properties in CSS, see the Index DOT Css Property Index.
Rule of Thumb: if an HTML element or attribute gives cues as to how its contentsshould be displayed, then some or all of its functionality has been absorbed by stylesheets.
There may be several different reasons behind that, but one very common mistake is to have an external stylesheet that contains HTML markup in some form.
An external stylesheet must contain only CSS rules, and if required, correctly formed CSS comments; never include any HTML syntax, such as <style type="text/css">…
CSS comments are defined as anything that is placed between
/* (the comment start mark) and
*/ (the comment end mark). I.e. as follows…
/* This text right here is a correct CSS comment */
CSS comments may span multiple lines in the stylesheet. Nesting of CSS comments is not allowed.
Another reason for external stylesheets (and even embedded and inline stylerules) not to function as expected may be that you have tried to make use of some CSS-features that are not supported in the browser you are using.
External stylesheets shall also be served from the www-server with a MIME-type of 'text/css' in its 'Content Type:' HTTP header.
You may need to negotiate with your server admin to add this MIME type to your server if you are not able to configure the server yourself.
How Do I Quote Font Names In Quoted Values Of The Style Attribute?
The attribute values can contain both single quotes and double quotes as long as they come in matching pairs. If two pair of quotes are required include single quotes in double ones or vice versa
<P STYLE="font-family: 'New Times Roman'; font-size: 90%">
<P STYLE='font-family: "New Times Roman"; font-size: 90%'>
It's been reported the latter method doesn't work very well in some browsers, therefore the first one should be used.
 |
| Workday Frequently Asked CSS Interview Questions Answers |
Which Property Is Used To Control The Position Of An Image In The Background?
The background-position property is used to control the position of an image in the background.
Which Property Is Used To Increase Or Decrease The Size Of A Font?
The font-size property is used to increase or decrease the size of a font.
What Does The Cascading In Cascading Style Sheets Mean?
Style Sheets allow style information to be specified from many locations. Multiple (partial) external style sheets can be referenced to reduce redundancy, and both authors as well as readers can specify style preferences.
In addition, three main methods can be employed by an author to add style information to HTML documents, and multiple approaches for style control are available in each of these methods. In the end, style can be specified for a single element using any, or all, of these methods.
Why Use Style Sheets?
Style sheets allow a much greater degree of layout and display control than has ever been possible thus far in HTML. The amount of format coding necessary to control display characteristics can be greatly reduced through the use of external style sheets which can be used by a group of documents. Also, multiple style sheetscan be integrated from different sources to form a cohesive tapestry of styles for a document. Style sheets are also backward compatible - They can be mixed with HTML styling elements and attributes so that older browsers can view content as intended.
How Do I Get Rid Of The Gap Under My Image?
Images are inline elements, which means they are treated in the same way as text. Most people kind of know this - they know that if you use 'text-align:center' on an image it will be centred. What many people don't realise is that this means you will have a gap underneath an image. This gap is for the descenders of letters like j,q,p,y and g. To get rid of this gap you need to make the image block-level - like this
CSS
img {display:block;}
One problem that this can cause is when you want to have a few images next to each other - if they are block-level, they won't be next to each other. To get around that, you can use float:left. Of course, this might present another problem - maybe you don't want the image to float left. In this case, you can use an unordered list like this
CSS
ul, li {
list-style-type:none;
padding:0;
margin:0 auto;
}
ul {
width:150px;
}
li {
float:left;
}
HTML
<ul>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
<li><img src="wine.jpg" height="50" width="50" alt="wine" /></li>
</ul>
Styles Not Showing?
There are different ways to apply CSS to a HTML document with a stylesheet, and these different ways can be combined
* inline (internal) (Deprecated for XHTML)
* embedded (internal)
* linked (external) and
* @import (external)
Note: An external stylesheet is a text file that contains only CSS Styles. HTML comments are not supposed to be in there and can lead to misinterpretation (> is the CSS "Child" selector!).
Are Style Sheets Case Sensitive?
No. Style sheets are case insensitive. Whatever is case insensitive in HTML is also case insensitive in CSS. However, parts that are not under control of CSS like font family names and URLs can be case sensitive - IMAGE.gif and image.gif is not the same file.
What Is Cascade?
Cascade is a method of defining the weight (importance) of individual styling rules thus allowing conflicting rules to be sorted out should such rules apply to the sameselector.
Declarations with increased weight take precedence over declaration with normal weight
P {color: white ! important} /* increased weight */
P (color: black} /* normal weight */
What Is Important Declaration?
Important declaration is a declaration with increased weight. Declaration with increased weight will override declarations with normal weight. If both reader's and author's style sheet contain statements with important declarations the author's declaration will override the reader's.
BODY {background: white ! important; color: black}
In the example above the background property has increased weight while the color property has normal.
What Is Css Declaration?
CSS declaration is style attached to a specific selector. It consists of two parts; property which is equivalent of HTML attribute, e.g. text-indent: and value which is equivalent of HTML value, e.g. 10pt. NOTE: properties are always ended with a colon.
What Is Class Selector?
Class selector is a "stand alone" class to which a specific style is declared. Using the CLASS attribute the declared style can then be associated with any HTML element. The class selectors are created by a period followed by the class's name. The name can contain characters a-z, A-Z, digits 0-9, period, hyphen, escaped characters, Unicode characters 161-255, as well as any Unicode character as a numeric code, however, they cannot start with a dash or a digit. (Note: in HTML the value of the CLASS attribute can contain more characters).It is a good practice to name classes according to their function than their appearance.
.footnote {font: 70%} /* class as selector */
<ADDRESS CLASS=footnote/>This element is associated with the CLASS footnote</ADDRESS>
<P CLASS=footnote>And so is this</P>
Corecss interview questions and answers for freshers and 1 to 5 years experience candidate.Learn tips and tricks for cracking css interview questions .Coding tag will guide you the best e-learning website that cover all technical and learn technical tutorial based on different languages.
ReplyDeletePost a Comment