Home » Squidoo Community » Lensmaking Tips

Boxes and Borders - Another HTML Cheat Sheet

Ranked #1,950 in Squidoo Community, #186,632 overall

Due to popular demand*...

...I'm making this lens with a variety of color themes, and also a selection of border styles. Use it for highlighting quotes or extracts. Copy and paste the code replacing the text inside. Enjoy!






* Popular Demand = At least one person asked me :D

Blue Theme

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.



<p style="padding: 5px; background-color: #9ABDEC; border: dotted 2px #0669B2;">TEXT GOES HERE</p>

Dark Green Theme

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.



<p style="padding: 5px; background-color: #66CC66; border: dotted 2px #006600;">TEXT GOES HERE</p>

Green Theme

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.



<p style="padding: 5px; background-color: #88F777; border: dotted 2px #38DE1F;">TEXT GOES HERE</p>

Gray Theme

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.



<p style="padding: 5px; background-color: #D1D1D1; border: dotted 2px #9E9D9D;">TEXT GOES HERE</p>

Orange Theme

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.



<p style="padding: 5px; background-color: #FFAF69; border: dotted 2px #FF7B00;">TEXT GOES HERE</p>

Purple Theme

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.



<p style="padding: 5px; background-color: #CE85F2; border: dotted 2px #821BB5;">TEXT GOES HERE</p>

Red Theme

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.



<p style="padding: 5px; background-color: #DE9671; border: dotted 2px #993300;">TEXT GOES HERE</p>

Leave some feedback!

No doubt the gurus will be along soon to copy and paste the code into their $37 ebooks. In the meantime, you can join the ranks of those who post real testimonials! Right here! Right now!

Remember: Squidoo's not only free to earn but it's free to learn!

  • im1337mi Feb 6, 2012 @ 8:42 am | delete
    Thanks for sharing!
  • glitterfrog May 18, 2011 @ 2:42 pm | delete
    You had me at your definition of "popular demand"! Love this and thank you!!
  • sorana Feb 2, 2011 @ 5:18 am | delete
    I love the dotted borders although I haven't used them too much in my lenses. I don't know why not.
  • mayapearl Sep 17, 2010 @ 2:03 am | delete
    Great lens, I am going to put a little colour into my lenses.
    TU
  • JaguarJulie Mar 21, 2010 @ 11:54 am | delete
    Ah, now this is what I'm liking ... a colourful lens! Hugs.
  • Load More
Show All

More Squidoo Tips...

Loading

by

N376

Glen likes to write. If it's something that he hasn't already enjoyed or experienced in life if you so much as throw a topic at him and if he finds it... more »

Feeling creative? Create a Lens!

Related Tags