ansaurus

Question

Answer 1

+2 A:

* (Asterisk) - It is a wildcard, this means it will select all elements within that portion of the DOM. It's a universal rule which affect on every element. for example:

Margin every element on the page

* {
    margin: 10px;
}

All HTML components will have those attributes.

Body affects only on the body tag...The elements within the tag aren't affected - (they are not getting the same attributes.)

cthulhu 2010-06-26 10:27:02

Priority> and if two instructions with the same property are defined for both `*` and `body` (or any other element), than the one defined for the element will have a higher priority (more weight) and its value will appear.

Felipe Alsacreations 2010-06-26 13:05:02

Answer 2

+1 A:

body applies to the <body> tag, while * applies to every tag. An example of the difference can be seen in the following:

body { margin: 2cm; }

versus

* { margin: 2cm; }

The first gives the body a margin – the second gives every element a margin.

On the other hand, the following code:

body { font-family: Courier; }

will change the font family in the whole document since CSS uses cascading styles, i.e. nested tags inherit certain style properties from their parents – in this case, the font.

Konrad Rudolph 2010-06-26 10:31:08

Answer 3

+1 A:

Using * in CSS matches any element. Using it alone is rarely useful, because you will target every element in the page.

If you for have html code like this:

<html>
<head>
  <title></title>
  <style>
  body { font-size: 50px; }
  </style>
</head>
<body>
  <div>
    <form>
      Name: <input type="text"/>
    </form>
  </div>
</body>
</html>

The font size set for the body will affect the text "Name:", but it will not affect the font size of the input element, as it has a specific size set by default.

If you now add the style * { border: 10px solid red; font-size: 100px; } this will put a border on the body, div, form and input elements, and both the text and the input element will get the font size.

The * selector is more useful in combination with other selectors, like selecting any child element to a specific element:

#Menu > * { float: left; }

Regarding what to use for the html and body element, you only need to set the margin, padding and background for the body element.

Guffa 2010-06-26 10:43:11

@guffa is this necessary to use * properties or not in my condition?

kc rajput 2010-06-26 10:46:22

@kc: No, it's certainly not neccesary. It's rarely used, and when it's used it's mostly for css hacks (the * html hack). I have never used it for anything myself.

Guffa 2010-06-26 11:44:01

ansaurus

tags:

views:

answers:

body and (*) Properties in css.

related questions