Posted by HTML GUIDE :: Basics, Images and Tables

{Leaving} (#43698)


View Forum Posts


Posted on
2015-06-16 07:04:48



Hello! This is a HTML Guide I made from other HTML Guides, I couldn't find one with all the info on so I created my own. I do no know a lot about HTML but I know the basics.

Feel free to ask for help on this thread and me or someone else will help

Before we begin, this is really important or the HTML will not work, remove all the spaces! If you don't do this the code will not work



qNfBj4T.png



○○○ Making your text Bold ○○○

< b > TEXT HERE < /b >

line2.png

○○○ Making your text italics ○○○

< i >TEXT HERE< /i >

line2.png

○○○ Making your text underlined ○○○

< u >TEXT HERE< /u >

line2.png

○○○ Making your text striked ○○○

< s >TEXT HERE< /s >

line2.png

○○○ Making your text highlighted ○○○

< span style="background-color:#HEXCODE" > TEXT HERE < /span >

line2.png

○○○ Making your text colored ○○○

< font color=#HEXCODE >TEXT HERE< /font >

line2.png

○○○ Making your text a link ○○○

< a href="URL HERE" >TEXT HERE< /a >

line2.png

○○○ Making your text a different size ○○○

< font size=1-7 >TEXT HERE< /font >

line2.png

○○○ Making a header ○○○

Biggest: < h1 >TEXT HERE< /h1 >
Medium: < h2 >TEXT HERE< /h2 >
Smallest: < h3 >TEXT HERE< /h3 >

line2.png

○○○ Making a block-quote ○○○

< blockquote >TEXT HERE< /blockquote >

line2.png

○○○ Making your text a font ○○○

< p style="font-family:FONT HERE;" >TEXT HERE< /p >

line2.png

○○○ Aligning your text ○○○

< p style="text-align:cener/right/left;" >TEXT HERE< /p >

line2.png

○○○ Color, Align and Font your text! ○○○

< p style="font-family:FONT HERE;color:#HEXCODE;text-align:center;">TEXT HERE< /p>



STVHa0P.png



○○○ Normal Image ○○○

< img src="URL HERE" >

icon-time-night.png


line2.png

○○○ Changing the image size ○○○

< img src="URL HERE" height=HEIGHT NUMBER width=WIDTH NUMBER >

icon-time-night.png


line2.png

○○○ Making the image clickable ○○○

< a href="URL LINK HERE" > < img src="IMAGE URL HERE" > < /a >

icon-time-night.png

line2.png

○○○ Making the image clickable + re-size ○○○

< a href="LINK URL" > < img src="IMAGE URL" height=NUMBER width=NUMBER > < /a >

line2.png

○○○ Making an image 'float' ○○○

< img src="URL HERE" style="float:ALIGN;width:HEREpx;height:HEREpx;" >

line2.png

○○○ Making space(s) between the images/text/etc ○○○

< br >
will make a space

< p >
will make a double space



lScjWm3.png



Tables have changed on LD from the 08-11, here is the news post about it, right near the bottom is all you need to know. Scroll boxes no longer work and have to be implemented in CSS.

line2.png

○○○ This thread table ○○○

< table style="background:#HEXCODE;width:630px;height:70px;border:1px solid;">< tr >< td >TEXT HERE< /td >< /tr >< /table >

Can also be used for dens (example with mine)

line2.png

○○○ Stuff for tables ○○○

Font - ;font-family:HERE;
Color - ;color:#HEXCODE;
Background color - ;background-color:#HEXCODE;
Width & Depth - ;width:HEREpx; | ;height:#HEREpx;
Alignment - ;text-align:center/right/left;





○ Google is amazing, use it! Google stuff and teach yourself HTML
This is my favorite website to find a color
This is my favorite website to find color groups
This thread is amazing for HTML Tables
This is an amazing website, it's basically everything HTML if you want to know more
○ If anyone has anymore HTML I can add let me know through PM or post on here, as well as help others that may post for help if you can
○ Remember: REMOVE the spaces!

Thank you if you use and bookmark






Hrt Icon 43 players like this post! Like?

Edited on 27/09/17 @ 09:20:35 by 🌅 Nocturnal (Sunset) (#43698)

Devin (#141123)

King of the Jungle
View Forum Posts


Posted on
2018-06-29 16:16:43
lol
Don't you dare clutter this thread too XD



Hrt Icon 0 players like this post! Like?

CKGylaonGlow (#127632)

Ill-Natured
View Forum Posts


Posted on
2018-06-29 16:33:19
I won’t.
I promise XD

Just saying hai!

*drops one chicken*

BAI!



Hrt Icon 0 players like this post! Like?

Paula (#149161)


View Forum Posts


Posted on
2018-07-23 14:45:08
i'm using my laptop and trying to make a clickable pic but when i right click and choose copy image address it comes up with https://static.lioden.com/images/blank.png how do i get round this? (still new to this)



Hrt Icon 0 players like this post! Like?

Myr (#188)


View Forum Posts


Posted on
2018-07-23 16:31:53
Lion images on LD are made up of multiple layers so you can’t just get their straightforward link this way like you would for other images. You need to screenshot and then upload it to a hosting site :)



Hrt Icon 0 players like this post! Like?

🌸Rehab🌸 (#138928)

Heavenly
View Forum Posts


Posted on
2018-08-01 11:26:19
< a herf="https://www.lioden.com/lion.php?mid=138928" >Test< /a >



Hrt Icon 0 players like this post! Like?

🌸Rehab🌸 (#138928)

Heavenly
View Forum Posts


Posted on
2018-08-01 11:38:18



Hrt Icon 0 players like this post! Like?

kitt (#154336)

Magnificent
View Forum Posts


Posted on
2018-10-01 20:24:15
i am still not able to put an image



Hrt Icon 0 players like this post! Like?

𓆱𓃥 ⭒foxfire
⭒ 𓃦 𓆱 (#77306)

Sapphic
View Forum Posts


Posted on
2018-10-01 20:55:10
What are you doing, kitt?



Hrt Icon 0 players like this post! Like?

kitt (#154336)

Magnificent
View Forum Posts


Posted on
2018-10-01 20:58:54
well this person already told me thats its made of multiple layers but i still dont know how to put an image



Hrt Icon 0 players like this post! Like?

𓆱𓃥 ⭒foxfire
⭒ 𓃦 𓆱 (#77306)

Sapphic
View Forum Posts


Posted on
2018-10-01 21:06:10
...you copy/paste the code provided for you after uploading your image to something like imgur or tinypic. I mean...that's pretty much all there is to it?



Hrt Icon 0 players like this post! Like?

fireflii (#8644)

Dreamboat of Ladies
View Forum Posts


Posted on
2018-10-04 17:50:17
Make sure you're using the image's direct url, not the url of the page the image is hosted on. For example, if you wanted to use this lion image:

1-lion-charge-gc590a.jpg

Don't use this link because that links to the page it's on. Use this link which is the image itself. You can find it by right-clicking the image and selecting "Copy Image Location" (or similar, it slightly varies depending on what browser you're using). A good indication you have the right link is if it ends in .png, .jpeg, or .jpg.

The code just looks like this:
<img src="LINK" />

In the example above, this is what it looks like:
<img src="http://www.krugerpark.co.za/images/1-lion-charge-gc590a.jpg" />



Hrt Icon 0 players like this post! Like?


Edited on 04/10/18 @ 17:51:48 by fireflii (#8644)

Buck (#158478)

Lone Wanderer
View Forum Posts


Posted on
2018-11-11 23:49:23
this is absolute amazing



Hrt Icon 0 players like this post! Like?

Jewel Wildmoon (#127341)

Deathlord of the Jungle
View Forum Posts


Posted on
2018-12-21 19:03:40
Ack tysm! Also how do you put images to have a message when you scroll over it? :0:



Hrt Icon 0 players like this post! Like?

Sacramora (#140353)

Magnificent
View Forum Posts


Posted on
2019-03-17 17:38:32
What about gifs? How would you do those?



Hrt Icon 0 players like this post! Like?

Nilla ♡ Clean Ice
Pie (#157779)

King of the Jungle
View Forum Posts


Posted on
2019-03-17 17:41:48
Same way as Images.
C:



Hrt Icon 0 players like this post! Like?







Memory Used: 633.05 KB - Queries: 2 - Query Time: 0.00103 - Total Time: 0.11604s