Animaljam Dog Packs Wikia
Don't have an account?
Register
Advertisement
Register

A very detailed guide to our wiki

Revision as of 12:51, 23 September 2017 by CreekSplash101 (Message Wall | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
 Sign in to edit

Borders[]

Types of Border[]

This is a solid border 

<div style="border:2px black solid;text-align:center;padding:20px">Text</div>




This is a dotted border 

<div style="border:2px black Dotted;text-align:center;padding:20px">
Text
</div>




This is a dashed border 

<div style="border:2px black dashed;text-align:center;padding:20px">
Text
</div>




This is a double border 

<div style="border:7px black double;text-align:center;padding:20px">
Text
</div>




This is a ridge border 

<div style="border:10px gray ridge;text-align:center;padding:20px">
Text
</div>




This is an inset border 

<div style="border:10px gray inset;text-align:center;padding:20px">
Text
</div>




This is an outset border 

<div style="border:10px gray outset;text-align:center;padding:20px">
Text
</div>




This is a groove border 

<div style="border:10px gray groove;text-align:center;padding:20px">
Text
</div>




This is a shadow border/box shadow. 

<div style="box-shadow:inset 0px 0px 60px black;text-align:center;padding:20px">
Text
</div>

===Rounded Borders===




This is a rounded solid border 

<div style="border:2px black solid;text-align:center;padding:20px;border-radius:40px;">Text</div>




This is a rounded dotted border 

<div style="border:2px black Dotted;text-align:center;padding:20px;border-radius:40px;">
Text
</div>




This is a rounded dashed border 

<div style="border:2px black dashed;text-align:center;padding:20px;border-radius:40px;">
Text
</div>




This is a rounded double border 

<div style="border:7px black double;text-align:center;padding:20px;border-radius:40px;">
Text
</div>




This is a rounded ridge border 

<div style="border:10px gray ridge;text-align:center;padding:20px;border-radius:40px;">
Text
</div>




This is a rounded inset border 

<div style="border:10px gray inset;text-align:center;padding:20px;border-radius:40px;">
Text
</div>




This is a rounded outset border 

<div style="border:10px gray outset;text-align:center;padding:20px;border-radius:40px;">
Text
</div>




This is a rounded groove border 

<div style="border:10px gray groove;text-align:center;padding:20px;border-radius:40px;">
Text
</div>




This is a rounded shadow border/box shadow. 

<div style="box-shadow:inset 0px 0px 60px black;text-align:center;padding:20px;border-radius:40px;">
Text
</div>




mmmmmm look at this border
<center>
<div style="border: 10px solid black; -moz-border-radius: 30px; -webkit-border-radius: 30px; border-radius:0px;width: 89%;box-shadow:inset 0px 0px 50px maroon"><div style="border: 7px double #660000; -moz-border-radius: 0px; -webkit-border-radius: 10px; border-radius: 50px;"><div style="border:2px black solid;box-shadow:0px 0px 30px maroon;box-shadow:inset 0px 0px 50px black;padding:20px">Your text</div></div></div></center>




Hi there Template:Username 

<center>
<div style="border: 1px solid black; width: 87%; padding: 4px;">
<div style="border: 15px solid black; padding: 4px;">
<div style="border: 1px solid black; padding: 15px;font-family:Courier New;">
<div style="border: 1px solid black;border-radius: 1pc;">

Your text

</div>
</div>
</div>
</div>
</center>





This is a nice border, in my opinion anyway. 

<center>
<div style="border:1px gray solid;padding:5px;box-shadow:inset 0px 0px 120px gray">
<div style="border:15px gray solid;padding:5px">
<div style="border:1px gray solid;padding:15px;">
<div style="border:1px gray solid;padding:15px;border-radius:20px">

Your text

</div>
</div>
</div>
</div>
</center>




This is a rather decent border. 

<center>
<div style="border: 14px solid #000; -moz-border-radius: 10px; -webkit-border-radius: 0px; border-radius: 0px; padding: 0px;box-shadow: inset 0 0 90px #000;width:89%;padding:px">
<div style="border: 1px solid #000; border-radius: 20px; padding: 30px">

Your text

</div></div></center>








This is simple, but I like it 



<center>
<div style="border:25px solid black;box-shadow:inset 0px 0px 70px black">
Text
</div>
</center>




This border is somewhat interesting 

<center>
<div style="border:10px solid gray;"><div style=" padding: 30px; border: none;margin: 3px; -webkit-border-radius: 10px; border-radius: 10px; box-shadow: inset 0 0 50px gray">
<div style="border: 4px solid gray; -moz-border-radius: 0px; -webkit-border-radius: 80px; border-radius: 10px;"><div style="border: 2px solid gray; -moz-border-radius: 90px; -webkit-border-radius: 10px; border-radius: 50px;padding:20px">

Text

</div></div></div></div></center>






<div style="border: 9px solid #405066;">
<div style="border: 6px double white; -moz-border-radius: 2px; -webkit-border-radius: 5px; border-radius: 90px;">
<div style="border: 4px solid #405066; box-shadow: 0 0 38px 2px black;">
<div style=" padding: 30px; border: 2px black;margin: 0px;font-family: COLORS;box-shadow: inset 0 0 70px #405066;">




  


<div style="text-align: center; border: 6px solid black;border-radius: 2pc;">
<div style="border: 3px dashed black; border-radius: 2pc;">
<div style="text-align: center; border: 6px solid black;border-radius: 2pc;">




 
<div style="border: 7px solid gray; background-color:transparent ">
<div style="border: 7px dashed white">
<div style="border: 7px solid gray; background-color:transparent">




 



 
<div style="border:1px solid black;">



This Is A Solid Border

<div style="border:4px black solid;text-align:center;padding:20px">Text Here</div>




This Is A dotted Border

<div style="border:4px black dashed;text-align:center;padding:20px">Text Here</div>




This Is A dotted Border

<div style="border:4px black dotted;text-align:center;padding:20px">Text Here</div>




This is a double border

<div style="border:7px black double;text-align:center;padding:20px">Text</div>




This Is A Dotted-Solid Border This can also be switched around. You can mix all sorts of borders! like dotted and dashed, and solid and dashed and more!
<div style="border:7px black double;text-align:center;padding:20px"><div style="border:2px black solid;text-align:center;padding:20px">Text Here</div>
     </div>




This Is A Dashed-Dotted Border!
<div style="border:7px black dashed;text-align:center;padding:20px"><div style="border:2px black dotted;text-align:center;padding:20px">Text Here</div>
     </div>




This is a Double-Dotted Border!
<div style="border:7px black double;text-align:center;padding:20px"><div style="border:2px black dotted;text-align:center;padding:20px">Text Here</div>
     </div>




This is a Double-Dashed Border!
<div style="border:7px black double;text-align:center;padding:20px"><div style="border:2px black dotted;text-align:center;padding:20px">Text Here</div>
     </div>



This is a Solid-Double Border!
<div style="border:7px black solid;text-align:center;padding:20px"><div style="border:2px black double;text-align:center;padding:20px">Text Here</div>
     </div>




This is a solid-Dashed Border!
<div style="border:7px black solid;text-align:center;padding:20px"><div style="border:2px black dashed;text-align:center;padding:20px">Text Here</div>
     </div>


♠Tables♠

Information Tables

Hey Look
At This!
It Is Used
For Information
Have Fun
With This
epic awesome
cool table

Heres the code! 


{| class="article-table" border="0" style="margin: 0px auto; width: 10px; height: 100px; border:1px inset black;"
  ! scope="col" style="font-family:center;background-color:green;text-align:center;"|<font color="white">Text</font>
  | style="text-align:center;"| Text
  |-
  ! scope="col" style="font-family:center;background-color:green;text-align:center;"|<font color="white">Text</font>
  | style="text-align:center;"|Text
  |-
  ! scope="col" style="font-family:center;background-color:green;text-align:center;"|<font color="white">Text</font>
  | style="text-align:center;"|Text
  |-
  ! scope="col" style="font-family:center;background-color:green;text-align:center;"|<font color="white">Text</font>
  | style="text-align:center;"|Text
  |-
  ! scope="col" style="font-family:center;background-color:green;text-align:center;"|<font color="white">Text</font>
  | style="text-align:center;"| Text
  |-
  ! scope="col" style="font-family:center;background-color:green;text-align:center;"|<font color="white">Text</font>
  | style="text-align:center;"|Text
  |-
  ! scope="col" style="font-family:center;background-color:green;text-align:center;"|<font color="white">Text</font>
  | style="text-align:center;"|Text
  |-
  ! scope="col" style="font-family:center;background-color:green;text-align:center;"|<font color="white">Text</font>
  | style="text-align:center;"|Text
  |}

Ranking Tables

Text

Text
D
D

Text

Text

Heres The Code! 

{| class="article-table" style="margin: 10px auto; width: 300px; height: 100px;border: 6px solid black;color:white"
  | scope="row" style="background-color:green;border-color:black;text-align:center;" |
  '''Text'''
  | scope="row" style="background-color:green;border-color:black;text-align:center;" |'''Text'''
  |-
  | scope="row" style="background-color:White;border-color:black;text-align:center;" |[[File:Screen_Shot_2017-08-16_at_11.40.52_AM.png|thumb|239 px]]
  | scope="row" style="background-color:White;border-color:black;text-align:center;" |[[File:Screen_Shot_2017-08-16_at_11.47.03_AM.png|thumb|239 px|]]
  |-
  | scope="row" style="background-color:green;border-color:black;text-align:center;" |<div style="overflow: hidden; height: 100px; width: 230px; margin-center: 0px; overflow-y: scroll">
  
  
  Text Here
  </div>
  | scope="row" style="background-color:green;border-color:black;text-align:center;" |<div style="overflow: hidden; height: 100px; width: 230px; margin-center: 0px; overflow-y: scroll">
  
  
  
  Text Here
  </div>
  |}


Colored Table

Name
Username
Mate
Gender
App.
N/A N/A N/A N/A N/A 


{| class="article-table" border="2" cellpadding="1" cellspacing="1" style="margin: 0px auto; width: 200px; height: 10px; border:4px inset black;"
  |-
  | style="text-align: center; background-color: Green; border-color: #2b0900;" |<div style="font-size:12pt;color:white;">Name</div>
  | style="text-align: center; background-color: green; border-color: #2b0900;" |<div style="font-size:12pt;color:white;">Username</div>
  | style="text-align: center; background-color: green; border-color: #2b0900;" |<div style="font-size:12pt;color:white;">Mate</div>
  | style="text-align: center; background-color: green; border-color: #2b0900;" |<div style="font-size:12pt;color:white;">Gender</div>
  | style="text-align: center; background-color: green; border-color: #2b0900;" |<div style="font-size:12pt;color:white;">App.</div>
  |-
  | style="text-align:center;" | N/A
  | style="text-align:center;" | N/A
  | style="text-align:center;" | N/A
  | style="text-align:center;" | N/A
  | style="text-align:center;" | N/A
  |}


♠Coloring Text/Borders!♠


Now, For Coloring Borders. You just need to choose a color really, i often use hex-codes, but ya'll are welcome to choose. I dont have a color list, i could try and make one, but until that's settled, i'll post the Hex-codes i use, and you guys can decide! also, there is a great color list here  Bellow me is the code i used, it is a normal dotted border, but i made it green. If you want to make a green or any color border, simply replace "Black" with the color of your choice. 


<div style="border:4px #15fa12 dotted;text-align:center;padding:20px">Text Here</div>



This is how this border would look like.


List Of Hex Codes In Rainbow Order:

How to color font: 

<font color=Insertcolorhere>Text</font>


  1. fc0000


  1. fc2600


  1. fc4100


  1. fc5800


  1. fc7300


  1. fc5800


  1. fcc300


  1. f1f808


  1. d4f808


  1. c1f808


  1. a1f808


  1. 80f808


♠Backgrounds!♠

Tbd- Gradient Backgrounds

♠---------------------♠

Community content is available under CC-BY-SA unless otherwise noted.
Advertisement

Fan Feed