=jimmy-tm

The Nellie, a cruising yawl, swung to her anchor without a flutter of the sails, and was at rest. The flood had made, the wind was nearly calm, and being bound down the river, the only thing for it was to come to and wait for the turn of the tide.

The sea-reach of the Thames stretched before us like the beginning of an interminable waterway. In the offing the sea and the sky were welded together without a joint, and in the luminous space the tanned sails of the barges drifting up with the tide seemed to stand still in red clusters of canvas sharply peaked, with gleams of varnished sprits. A haze rested on the low shores that ran out to sea in vanishing flatness.

Pullquotes are quotes that are pulled out of the main text. A pullquote is an effective way to re-emphasise a point you've already made. They are simple tomake and you should be able to grash the concept quite easily.






The HTML is simple enough. The div class="pullquote" defines the div class as "pullquote", so we can style it accordingly.

Ok onto the CSS. div.pullquote is the selector we are going to be styling. It basically means the div that has a class called "pullquote". We want the element to "float" to one side, All floating does is make the element go as far to the specified side of the parent element as possible and then wraps the text around that element. Simple? Right?

"width:150px;" and "font-size: 18px;" are both self explanatory.
PROTIP: the width property can have several types of values, namely: A pixel value(How many pixel wide. End the number in a "px"), A percentage value (What percent of the parent element will the element take up?. End the number with a "%"), inherit(Inherit's the width value from the parent element.) and auto(Automatically sets the width value.).

A margin is the amount of space between the outside of the element and the outside of the next element, please note that this is different to padding which specifies a width between the content of an element and the border of that element.

"font-family:"Times New Roman";" says that the font of everything in this element will be Times new roman. Font choice is very important in web design and can make or break any design. I went for a sans-serif font because it's a quote and it looks nice.

Ok Last property is "font-style:italic" says that we want the font-style to be Italic.



":first-letter" is a Pseudo Class, CSS pseudo-classes are used to add special effects to some selectors. So this CSS will add a special effect to the First Letter of the div with a class called "pullquote". Other Pseudo classes include: :hover, :visited, and :first-line. Ok the CSS is pretty simple in this case. We set the "color" property to #00d8ff which is a blue colour, and we set the property "font-size" to 42px.

And that's it. If you have any questions please post them.

Thanks for reading.

The Nellie, a cruising yawl, swung to her anchor without a flutter of the sails, and was at rest. The flood had made, the wind was nearly calm, and being bound down the river, the only thing for it was to come to and wait for the turn of the tide.

The sea-reach of the Thames stretched before us like the beginning of an interminable waterway. In the offing the sea and the sky were welded together without a joint, and in the luminous space the tanned sails of the barges drifting up with the tide seemed to stand still in red clusters of canvas sharply peaked, with gleams of varnished sprits. A haze rested on the low shores that ran out to sea in vanishing flatness.