What is the difference between # and. with CSS?

Question

What is the difference between # and . with CSS?

 #main { background-color: #fff; _height: 1px; /* only IE6 applies CSS properties starting with an underscrore */ } .main { background-color: #fff; _height: 1px; /* only IE6 applies CSS properties starting with an underscrore */ } 

Answer 1

' # ' represents the identifier. " . " is a class.

So. <tagname id="main"> and <tagname class="main"> ....

hope this helps.

Answer 2

Sign

'#' indicates the identifier of the html element. it is for:

 <div id='main'>...</div> 

'' sign represents the html element class. and this is for:

 <div class='main'>...</div> 

Answer 3

From the HTML 4 specification :

The id attribute assigns a unique identifier to an element.

The id attribute has several roles in HTML:

• As a style sheet selector.
• As a target anchor for hypertext links.
• As a means of referencing a specific element from a script.
• As the name of the declared OBJECT element.
• For general-purpose processing, user agents (for example, for identifying fields when extracting data from HTML pages into a database, translation
  HTML documents in other formats,
  and etc.).

The class attribute, on the other hand, assigns one or more class names to an element; we can say that the element belongs to these classes. A class name can be used by multiple instances of elements. The class attribute has several roles in HTML:

• As a style selector (when the author wants to assign a style of information to a set of elements).
• For general-purpose processing by user agents.

Answer 4

The class (.my_class_name) can be present several times on the same page, while id (#my_id_name) is unique.

Answer 5

'#' is the identifier and. represents a class. As you know, you cannot duplicate identifiers in HTML, so if you want the same style to represent multiple elements, you should use a class.

Answer 6

# applies automatically to an element with the same CSS id

 #id1 {some style} 

HTML

 <div id="id1"> <-- automatically applied here... 

CSS

 .Dot1 {} DIV.Dot2 {} 

DIV.Dot2 only applies to DIVs with the "Dot2" class, if any other element tries to use Dot2, it will not work

HTML

 <div class="Dot1"> <-- only applies when you give class.. 

. not automatically applied automatically, you should use it in the "class" attribute for each element in which you want to apply them.

Answer 7

# indicates the identifier of the selector,. a class selector . Identifiers must be unique in the document (so there is only one element with one specific identifier), and a class can contain several elements, and an element can be in several classes.

So, #main will select one element with the identifier main , and .main will select all the elements that are in the main class. In addition, both selectors have different specificities that affect the order in which CSS properties are applied to elements or overwrite existing properties.

Answer 8

# used with the id name to write css for it on the html page, which must be unique.

. used with the class name to write css for it, which can be used anywhere on the html page.

Example::

  <div id="container"> <div class="container"> <div class="container"> Foo thing </div> </div> </div> 

And its CSS as below

 #container, .container { position: relative; margin: 20px 50px; ...... ......... } 

or separately as shown below

 #container { position: relative; margin: 20px 50px; ...... ......... } .container { position: relative; margin: 20px 50px; ...... ......... }