Apply a Style to a Tag
HTML tag ေတြကိုလည္း CSS သံုးျပီး လြယ္လင့္ တကူေျပာင္းလဲလုိ႕ရပါတယ္။ ဥပမာ။ Paragraph က စာလံုးေတြအားလံုးကို Arial font face ထားမယ္ စာလံုး ကို 15px ထားမယ္ ဆုိပါေတာ့။ <p> က စာေတြ အားလံုးေျပာင္းလဲမွာျဖစ္တဲ့အတြက္ေၾကာင့္ ေအာက္ က ပံုစံလုိ ေရးလို႕ရပါတယ္။
<!DOCTYPE html>
<html>
<head>
<title>CSS</title>
<style>
p {
font-family: Arial;
}
</style>
</head>
<body>
<p>HTML5 is a markup language for structuring and presenting content for the World Wide Web and a core technology of the Internet. It is the fifth revision of the HTML standard (created in 1990 and standardized as HTML 4 as of 1997) and, as of December 2012, is a W3C Candidate Recommendation. Its core aims have been to improve the language with support for the latest multimedia while keeping it easily readable by humans and consistently understood by computers and devices (web browsers, parsers, etc.). HTML5 is intended to subsume not only HTML 4, but also XHTML 1 and DOM Level 2 HTML.</p>
<p>Following its immediate predecessors HTML 4.01 and XHTML 1.1, HTML5 is a response to the observation that the HTML and XHTML in common use on the World Wide Web are a mixture of features introduced by various specifications, along with those introduced by software products such as web browsers, those established by common practice, and the many syntax errors in existing web documents. It is also an attempt to define a single markup language that can be written in either HTML or XHTML syntax. It includes detailed processing models to encourage more interoperable implementations; it extends, improves and rationalises the markup available for documents, and introduces markup and application programming interfaces (APIs) for complex web applications.For the same reasons, HTML5 is also a potential candidate for cross-platform mobile applications. Many features of HTML5 have been built with the consideration of being able to run on low-powered devices such as smartphones and tablets. In December 2011, research firm Strategy Analytics forecast sales of HTML5 compatible phones will top 1 billion in 2013.</p>
</body>
</html>p tag ေတြ အားလံုးဟာ font က Arial ျဖစ္ျပီးေတာ့ font-size က 15px ျဖစ္သြားပါမယ္။ အဲဒီ code ကိုပဲ ကၽြန္ေတာ္တုိ႕ေတြ h1 ထည့္ထားတဲ့ Example ေလးၾကည့္လိုက္ပါ။
<!DOCTYPE html>
<html>
<head>
<title>CSS</title>
<style>
h1 {
font-size:200%;
color:#DDDDDD;
}
p {
font-family: Arial;
}
</style>
</head>
<body>
<h1>HTML5</h1>
<p>HTML5 is a markup language for structuring and presenting content for the World Wide Web and a core technology of the Internet. It is the fifth revision of the HTML standard (created in 1990 and standardized as HTML 4 as of 1997) and, as of December 2012, is a W3C Candidate Recommendation. Its core aims have been to improve the language with support for the latest multimedia while keeping it easily readable by humans and consistently understood by computers and devices (web browsers, parsers, etc.). HTML5 is intended to subsume not only HTML 4, but also XHTML 1 and DOM Level 2 HTML.</p>
<p>Following its immediate predecessors HTML 4.01 and XHTML 1.1, HTML5 is a response to the observation that the HTML and XHTML in common use on the World Wide Web are a mixture of features introduced by various specifications, along with those introduced by software products such as web browsers, those established by common practice, and the many syntax errors in existing web documents. It is also an attempt to define a single markup language that can be written in either HTML or XHTML syntax. It includes detailed processing models to encourage more interoperable implementations; it extends, improves and rationalises the markup available for documents, and introduces markup and application programming interfaces (APIs) for complex web applications.For the same reasons, HTML5 is also a potential candidate for cross-platform mobile applications. Many features of HTML5 have been built with the consideration of being able to run on low-powered devices such as smartphones and tablets. In December 2011, research firm Strategy Analytics forecast sales of HTML5 compatible phones will top 1 billion in 2013.</p>
</body>
</html>CSS ထဲမွာ h1 tag ကို မီးခိုးေရာင္ သံုးထားတာ ေတြ႕ႏိုင္ပါတယ္။ အဲဒီ code ကို browser မွာ ၾကည့္လုိက္ ရင္ ေအာက္ကလို ျမင္ရပါမယ္။
Figure 3-5