Difference between revisions of "Css tools exemples"
Jump to navigation
Jump to search
TheSevenSins (talk | contribs) |
TheSevenSins (talk | contribs) m |
||
| Line 3: | Line 3: | ||
* P = Paragraph. Its a box who is specified too contain text. This is what you want too use too separate texts | * P = Paragraph. Its a box who is specified too contain text. This is what you want too use too separate texts | ||
* br = adds a blank space. it is how you create space when you do not know how too use padding (space inside a box) and margin (space outside a box | * br = adds a blank space. it is how you create space when you do not know how too use padding (space inside a box) and margin (space outside a box | ||
| + | |||
| + | To make requests, go too this page discussion tab here | ||
| + | |||
<br> | <br> | ||
| Line 8: | Line 11: | ||
=== Text Shadow === | === Text Shadow === | ||
<p class="shadow"> spooky! <p> | <p class="shadow"> spooky! <p> | ||
| + | |||
| + | Code: <nowiki><p class="shadow"> spooky! <p></nowiki> | ||
=== Box === | === Box === | ||
| Line 13: | Line 18: | ||
<p>Box test!</p> | <p>Box test!</p> | ||
</div> | </div> | ||
| + | |||
| + | code: <nowiki><div class="box"> | ||
| + | <p>Box test!</p> | ||
| + | </div></nowiki> | ||
=== Box shadow === | === Box shadow === | ||
| Line 19: | Line 28: | ||
<p>Box test!</p> | <p>Box test!</p> | ||
</div> | </div> | ||
| + | |||
| + | Code: <nowiki><div class="box box_shadow"> | ||
| + | <p>Box test!</p> | ||
| + | </div></nowiki> | ||
=== Center text === | === Center text === | ||
| Line 25: | Line 38: | ||
<p>Box test!</p> | <p>Box test!</p> | ||
</div> | </div> | ||
| + | |||
| + | Code: <nowiki><div class="box centered_text"> | ||
| + | <p>Box test!</p> | ||
| + | </div></nowiki> | ||
=== Round box === | === Round box === | ||
| Line 31: | Line 48: | ||
<p>Box test!</p> | <p>Box test!</p> | ||
</div> | </div> | ||
| + | |||
| + | Code: <nowiki><div class="round_box centered_text"> | ||
| + | <p>Box test!</p> | ||
| + | </div></nowiki> | ||
=== Inverted === | === Inverted === | ||
| Line 36: | Line 57: | ||
<p>Box test!</p> | <p>Box test!</p> | ||
</div> | </div> | ||
| + | |||
| + | Code: <nowiki><div class="box centered_text inverted"> | ||
| + | <p>Box test!</p> | ||
| + | </div></nowiki> | ||
Revision as of 13:09, 15 November 2019
Notes:
- Div = all uses containers, think of it as a basic box. yes, you can put a box in a box in a box...
- P = Paragraph. Its a box who is specified too contain text. This is what you want too use too separate texts
- br = adds a blank space. it is how you create space when you do not know how too use padding (space inside a box) and margin (space outside a box
To make requests, go too this page discussion tab here
Text Shadow
spooky!
Code: <p class="shadow"> spooky! <p>
Box
Box test!
code: <div class="box"> <p>Box test!</p> </div>
Box shadow
Box test!
Code: <div class="box box_shadow"> <p>Box test!</p> </div>
Center text
Box test!
Code: <div class="box centered_text"> <p>Box test!</p> </div>
Round box
Box test!
Code: <div class="round_box centered_text"> <p>Box test!</p> </div>
Inverted
Box test!
Code: <div class="box centered_text inverted"> <p>Box test!</p> </div>
