button.navbar-toggle.collapsed(type='button', data-toggle='collapse', data-target='#navbar', aria-expanded='false')
span.sr-only Toggle navigation
span.icon-bar
span.icon-bar
span.icon-bar
nav#navbar.collapse.navbar-collapse(role='navigation')
<button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<nav id="navbar" class="collapse navbar-collapse" role="navigation"></nav>
This is Pug or Slim or similar?
NOTE the indentation is important - youāve just copy pasted as text here, so Iāve guessed. Indentation denotes nesting.
- The first item is the element
nav
becomes<nav></nav>
. #
is id:nav#navbar
becomes<nav id="navbar"></nav>
..
is class:nav.collapse
becomes<nav class="collapse"></nav>
.- The other attributes go in brackets, key=value seperated by commas (
role
,data-attribute
etc - `(name1=āvalue1ā, name2=āvalue2)ā). - Then a space and the text to go inside the element, or a new, indented line for something to be nested inside.
- Things on the same level of indentation are siblings.
1 Like
thank youļ¼ććććØćļ¼č°¢č°¢ļ¼you help me a lot!
Could you tell me what the use of this code in CSS is?
$fargglad:#722872;
$morkfarg:#592059;
$morkgra:#888;
Theyāre Sass variables, you assign values to variables and you can reuse them throughout your code. Like
h1 {
color: $fargglad;
}
Equiv in pure CSS is
:root {
--fargglad: #722872;
}
h1 {
color: var(--fargglad);
}
OK, I got it,Iām new here,there are a lot of things I need to learn,thanks for your guidance.