HTML alone can’t make a website (webpage). It always needs CSS and JavaScript. Where a CSS can add in HTML only using a “Style Attributes” for inline CSS and “<style> Tag” for Internal and External CSS. CSS Style Attribute plays an important role when you want to change single element color, size or anything want to change on it.
The only using Style attribute or Style tag is no completed proper understanding and implementation. You have to know about the importance of “CSS id” and “CSS class“.
CSS StyleSheet – Can be a separate or inline or
CSS style sheet example
Internal CSS: For that, you need to give id or class identity to elements. And if assign the style property directly to the HTML tag (p, h1, etc) then it will affect every same tag in a webpage.
Here is in <head> tag define CSS style sheet example.
<!DOCTYPE html>
<html>
<head>
<style>
#txt {
font-size: 24px;
font-style: bold;
color: blue;
}
</style>
</head>
<body>
<p id="txt">A text with size 24px</font></p>
<p>Without font-size changed text</p>
</body>
</html>Output:
For external CSS stylesheet follow this tutorial- https://tutorial.eyehunts.com//css/what-is-css-types-syntax-html-example/
HTML Style Attribute Example
In inline CSS style attributes are defined in HTML tag. See below code.
<!DOCTYPE html>
<html>
<body>
<p style="font-size: 24px;
font-style: bold;
color: red;">A text with size 24px</p>
<p>Without font-size changed text</p>
</body>
</html>Interview Question on CSS StyleSheet
Here is some Interview question for fresher and experienced candidate.
Q: What is header style CSS.
Answer: This is a tricky question. You would be thinking about a CSS which define (internal CSS) in the <head> tag.
Actually, a header style css can be a separate stylesheet or it can be the class or id name of the header. Where Header and footer is a section of any webpage. The header is also a tag in html.
Q: Which html tag is used to define an internal style sheet?
Answer: CSS <style> tag is used to define a n internal styleSheet in HTML.
Q: What does HTML Tag do?
Answer: CSS style tag used for add CSS rule in html tags. <style> tag is used in html document <head> tag.
Q: How to use html style tag in the body?
Answer: Using an internal CSS. In Html Tag, you can use the style attributes. See below example used style attribute in <p> tag. Same you can do with any tag which comes inside a <body> tag.
<p style="font-size: 24px;
font-style: bold;
color: red;">A text with size 24px</p>Do comment on this article if you have any suggestions with example.
Note: The All CSS Style Attribute examples are tested on Safari browser (Version 12.0.2).
OS: macOS 10.14 Mojave
Code: HTML 5 Version