Toyhouse

Resources

Bootstrap (Coding):

https://getbootstrap.com/docs/5.0/getting-started/introduction/

Font Awesome (Icons):
https://fontawesome.com/

Google (Anything):
Googling will get you very far, google "[what you're looking for] HTML Bootstrap", links in the search results from stackoverflow.com and www.w3schools.com usually have the answers. You can also search questions about ToyHou.se in Google and find ToyHou.se forum posts discussing what you're looking for.

Inspect Element (Viewing Code):
Right click or developer tools in browser menu to access. You can see any page's code (TH's site coding, user content, and some other sites use Bootstrap). Just don't use it to steal and reupload personal or P2U codes because that's sucky, there are plenty of F2U codes you can use instead.

I added some basic codes below (for personal reference and anyone interested), do not credit me for these. I will add more eventually, let me know if there are any specific codes you're looking for (check Bootstrap manual for more).

Codes for adding boxes

Theme color:
<div class="card mb p-3">Text</div>

Theme color alt:
<div class="card mb bg-faded p-3">Text</div>

Custom color:
<div style="background:#000000; padding-top: 12px; padding-bottom: 12px;padding-left: 12px;padding-right: 12px;">Text</div>

Custom color table:
<table style="width: 100%;">
<tbody>
<tr>
<td style="width: 100%; background-color: rgb(0,0,0); padding: 12px;">Text</td>
</tr>
</tbody>
</table>

Codes for adding backgrounds

Solid color:
<div style="position: absolute; top: 0px; bottom: 0px; left: 0px; background-color: rgb(0,0,0);width:100%; z-index: -1;">.</div>

Repeating image:
<div style='position: absolute; top: 0px; bottom: 0px; left: 0px; background: url("image"); width: 100%; z-index: -1;'>.</div>

Repeating image fixed:
<div style='position: absolute; top: 0px; bottom: 0px; left: 0px; background: url("image"); width: 100%; background-attachment: fixed; z-index: -1;'>.</div>

Stretch to fit image:
<div style='position: absolute; top: 0px; bottom: 0px; left: 0px; background: url("image");background-size:cover; width: 100%; z-index: -1;'>.</div>

Stretch to fit image fixed:
<div style='position: absolute; top: 0px; bottom: 0px; left: 0px; background: url("image");background-attachment:fixed; background-size:cover; width: 100%; z-index: -1;'>.</div>

Codes for adding padding

Padding:
<div class="p-3">Content</div>

Padding by pixels:
<div style="padding-top: 12px; padding-bottom: 12px;padding-left: 12px;padding-right: 12px;">Content</div>