Spans are very similar to divisions except they are an inline element versus a block level element. No linebreak is created when a span is declared.
You can use the span tag to style certain areas of text, as shown in the following:
<span class="bold">Css Spans</span>
Then in my CSS file:
span .bold{
font-wight: bold;
}
The final result is: Css Spans.
The purpose of this article to provide you with a basis for using CSS in an (X)HTML file.
Divisions are a block level (X)HTML element used to define sections of an (X)HTML file. A division can contain all the parts that make up your website. Including additional divisions, spans, images, text and so on.
You define a division within an (X)HTML file by placing the following between the tags:
<div> Site contents go here </div>
Though most likely you will want to add some style to it. You can do that in the following fashion:
<div id="mainBox">Site contents go here</div>
The CSS file contains this:
#mainBox{
width: 70%;
margin: auto;
padding: 20px;
border: 1px solid #666;
background: #ffffff;
}
Now everything within that division will be styled by the “mainBox” style rule, I defined within my CSS file. A division creates a linebreak by default. You can use both classes and IDs with a division tag to style sections of your website.
On this occasion I will explain to the newbies on how to create a simple HTML file.
But before I start, for beginners who really want to learn HTML, you should use a HTML text editor such as Notepad or Notepad + + for example. Because it helps you to memorize faster Tag-HTML tags instead of using the web layout application program which provides buttons to create HTML code instantly.
Here’s how to create HTML files:
Important :
In addition to the standard way of writing CSS style or giving properties inherent in the HTML selector, we can also provide their own name on a particular element by making the ID selector and Class selector.
ID Selector is a selector that can be used only once in an element, while the Class Selector can be used several times on an element.
Writing ID Selector in CSS begins with the symbol # (octothorpe), while writing the CSS class selector begins with a dot (.)
Example:
<html>
<head>
<title>CSS ID Selector</title>
<style type="text/css">
#header_title {
font-size:24px; font-weight:bold; color:#CC0000;}
#header_desc {
font-size:18px; font-weight:bold; color:#000066;}
.main {
font-family:Arial, Helvetica, sans-serif; line-height: 9px; }
</style>
</head>
<body>
<div>
<p id="header_title">CSS Syntax<br/><span id="header_desc">About CSS Id Selector and Class </span></p>
</div>
<div>
<p>Fill Your Stuff here</p>
<p>Fill Your Stuff here 2</p>
</div>
</body>
</html>
When viewed in a browser will be like this:
