What this content is for in Bootstrap

1

I'm using Bootstrap in v3.0 and parsing the CSS file %, I found this excerpt:

*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

I'd like to know what the * usage is.

In the current version of Bootstrap (3.3.4), , it is within a @media Print{} , like this:

@media print {
  *,
  *:before,
  *:after {
    color: #000 !important;
    text-shadow: none !important;
    background: transparent !important;
    -webkit-box-shadow: none !important;
            box-shadow: none !important;
  }

I would like to know, what is this code for?

    
asked by anonymous 16.04.2015 / 18:23

1 answer

3

Live!

The * symbol represents all elements of your HTML page.

For example, if you wanted to add a black backgroud to all elements of your HTML page you could use the following CSS:

* {
    background-color: #000;
}

The * symbol also allows you to select all elements within another element, for example:

div * {
    background-color: #000;
}

In the example above only the elements that were inside a div would be with the black background.

For your question about @media print {} , that means that the css is only applied when the page is in print preview mode.

You can read more about the various types of @media in the following link: link

    
17.04.2015 / 01:31