html - Nested Sass accessing -

I'm new to CSS and Assassins. I'm not sure how to change the appearance of my page. I am reading Sass Document And I think I want to play with a little Twitter Bootstrap and try it.

Sample code:

  & lt; Div class = "user_nav" & gt; & Lt; Div class = "navbar-wrapper" & gt; & Lt; Div class = "container" & gt; & Lt; Div class = "navbar-header" & gt; & Lt; Button type = "button" class = "navbar-toggle short" data-toggle = "collapse" data-target = ". Navbar-collapse" & gt; & Lt; Span class = "sr-only" & gt; Toggle Navigation & lt; / Span & gt; & Lt; Span class = "icon-bar" & gt; & Lt; / Span & gt; & Lt; Span class = "icon-bar" & gt; & Lt; / Span & gt; & Lt; Span class = "icon-bar" & gt; & Lt; / Span & gt; & Lt; / Button & gt; & Lt; A class = "navbar-brand" href = "#" & gt; JobPost & lt; / A & gt; & Lt; / Div & gt; & Lt; Div class = "navbar-collapse collapse" & gt; & Lt; Ul class = "nav navbar-nav" & gt;  

If I want to change the CSS of say class navbar-header, will it be the Scss code?

"Post-text" itemprop = "text">

What you need to know about SASS is that it is best not to override with new CSS for these types of frameworks, but the color / typography of the structure Etc., to override the defined SASS parameter.

For example, for Bootstrap, you can see if you can change _variables.scss for your example you can find and find:

  $ Navbar-height: 50px! Default;  

Now if you want to override it, you can do this as long as you redefine the SASS parameter after importing the _variables.scss file. If you look at bootstrap.scss, you will find that with most structures, they try to split all this into components. Ie is the first line from the following bootstrap.scss:

  // core variables and mixins @ import "bootstrap / variable"; @ Import "bootstrap / mixes"; // Reset and Dependencies ...  

Then you will see the components listed below, this is where you have a component that does not use your CSS files to avoid inflammation. can leave . Instead of using bootstrap.scss, you can make your own copy of that file, and delete the components you do not need - as well as redefine the parameters defined in variables as needed. Ie: (mybootstrap.scss):

  // Import the core variables and the mixes "Bootstrap / Variables"; @ Import "bootstrap / mixes"; // Override Navbar Height $ navbar-height: 150px; / / You want to cancel the default because it only specifies the variable if it does not already have a value // Reset and dependencies ... In some cases you can get your framework You can not go around without adding additional CSS to override the styles. Then what you want to do is the look that you want to override into sass files. So if I look sick in Bootstrap _navbar.scss component file, then find out:  
  .navbar-header {@include clearfix (); @ Media (minimum-width: $ grid-float-breakpoint) {float: left; }}  
 
 Which means that I can add the following to my _customOverrides.scss file which I import at the end of mybootstrap.scss - for example to override the example Navbar-header breakpoint grid for float. 
 
  .navbar-heather {@ media (minimum-width: 500 pixels) {float: left; }}  
 
 Hope these tips will help - and I am sure once you use SASS workflow, you will never go back! :)