Posts Tagged ‘css’

Chrome DevTools — Google Developers

Chrome DevTools — Google Developers.

Styling console output with CSS


Enhanced by Zemanta

CodeSlayer2010’s Code: jQuery Fancy Paragraph Styling (manila background, rounded-rectangle, drop-shadow, orange border)

screenshot of Eric CodeSlayer2010 Hepperle's jsfiddle jQuery -- fancy paragraph tag style 01

Jsfiddle Screenshot (07/13/13)

I wrote this jQuery in about 5 minutes. It is really simple, but amazingly powerful at the same time. The purpose of this is to instantly style paragraph tags. Here are the style parameters:

Background color: Manila (light beige-ish/yellow)
Border color: Orange
Drop-shadow: Yes
Rounded-rectangle: Yes

I want to make the code easily available to everyone, so I’ve provided the jQuery here in case you want to quickly add this style to your project. Cheers.


/* Add manilla background, rounded-rect, orange border,
 & shadow to paragraphs.
 (Press F12 in your browser to see the results)

 @Creator: Eric Hepperle (CodeSlayer2010)
 @Date: 07/13/13
 @Version: 1.0

 @Purpose: Puts a fancy style on paragraph <P>
 tags to make them 'pop'.

 8:30 - Created initial code.



 'border': 'solid #FFB819 3px',
 'box-shadow': '10px 10px 5px #888888',

HTML Table Building: 30+ Beautiful Examples and Useful Javascripts

November 12, 2012 1 comment