Move Action | Keystroke |
Beginning of the line | HOME |
End of the line | END |
Top of the document | CTRL+HOME |
End of the document | CTRL+END |
Selection | Technique |
Whole word | double-click within the word |
Whole paragraph | triple-click within the paragraph |
Several words or lines | drag the mouse over the words, or hold down SHIFT while using the arrow keys |
Entire document | choose Editing | Select | Select All from the Ribbon, or press CTRL+A |
and Click New or
and Click Open, or and Click Save or Save As (remember, if you’re sending the document to someone who does not have Office 2007, you will need to click the Office Button, click Save As, and ClickWord 97-2003 Document), or
and find the file you want to rename.
or:
Home: Clipboard, Fonts, Paragraph, Styles, and Editing.
Insert: Pages, Tables, Illustrations, Links, Header & Footer, Text, and Symbols
Page Layout: Themes, Page Setup, Page Background, Paragraph, Arrange
References: Table of Contents, Footnote, Citation & Bibliography, Captions, Index, and Table of Authorities
Mailings: Create, Start Mail Merge, Write & Insert Fields, Preview Results, Finish
Review: Proofing, Comments, Tracking, Changes, Compare, Protect
View: Document Views, Show/Hide, Zoom, Window, Macros
<div style="background-color:red;
width:100px;
height:100px;
position:relative;
top:10px;
left:80px;
z-index:2;">
</div>
<div style="background-color:yellow;
width:100px;
height:100px;
position:relative;
top:-60px;
left:35px;
z-index:1;">
</div>
<div style="width:300px;">
<h1 style="float:left;margin-right:10px;">CSS float</h1>
<p>If your browser supports the CSS float Property, this text will be flowing around the heading.
If this does not seem to work, it could be a browser compatibility thing...</p>
</div>
left<div style="position:relative;left:80px;background-color:yellow;width:100px;">
This div has relative positioning.
</div>
top, it would appear 80 pixels below where it would have been. It's important to note that other elements are not affected by this element's offset. Therefore, overlapping may occur.<div style="position:absolute;top:100px;left:60px;background-color:yellow;">
This div is absolutely positioned 100 pixels from the top and 60 pixels from the left of its containing block.</div>
<div style="position:fixed;top:100px;left:60px;width:180px;background-color:red;">
This div is using a fixed position of 100 pixels from the top and 60 pixels from the left of its containing block. When this page scrolls, this box will remain in a fixed position - it won't scroll with the rest of the page. Go on - SCROLL!</div>
<div style="background-color:orange;height:125px;width:75px;">
This div has height and width applied.
</div>
<div style="background-color:orange;max-height:125px;max-width:75px;">
This div has max-height and max-width applied.
</div>
<div style="background-color:orange;min-height:125px;min-width:75px;">
This div has min-height and min-width applied.
</div>
<ul style="list-style-type:circle;">
<li>List item one</li>
<li>List item two</li>
</ul>
<ul style="list-style-image:url(/pix/printer_icon.gif);">
<li>List item one</li>
<li>List item two</li>
</ul>
<ul style="list-style-position:inside;">
<li>List item one</li>
<li>List item two</li>
</ul>
<ul style="list-style-position:outside;">
<li>List item one</li>
<li>List item two</li>
</ul>
<ul style="list-style:square inside;">
<li>List item one</li>
<li>List item two</li>
</ul>
<ul>
<li style="display:marker;marker-offset:10px;">List item one</li>
<li>List item two</li>
</ul>
padding property to set padding on all sides of an element.<p style="border:1px solid orange;padding:20px;">
This text has padding of 20 pixels on all four sides.
</p>
<p style="border:1px solid orange;padding-left:60px;">This text has left padding of 60 pixels.</p>margin shorthand property, the padding property is shorthand for padding-top, padding-right,padding-bottom, and padding-left.<p>With padding:</p>
<div style="border:1px solid orange;width:100px;padding:20px 10px 0px 100px;">
Padded div
</div>
<p>Without padding:</p>
<div style="border:1px solid orange;width:100px;">
Non-padded div
</div>
<div> elements are specified to be 100 pixels wide. However, the padding on the first <div> pushes the size out, resulting in a larger <div>.margin, you don't need to provide different values for all four sides. You can provide one, two, three, or four values. Here's how it works:padding:10px;padding:10px 20px;padding:10px 20px 30px;padding:10px 20px 30px 40px;<div style="border:1px solid blue;">
<p style="border:1px solid orange;margin:20px;">
This text has a margin of 20 pixels on all four sides.
It is nested within a div with a border to make it easier to see the effect of the margin.
</p>
</div>
<p style="border:1px solid orange;margin-left:60px;">This text has a left margin of 60 pixels.</p>margin-top, margin-right, margin-bottom, and margin-left in the one place. This method is quicker. It also uses less code than the previous method. Actually, it's the same property that we used in our first example (i.e. the margin property). The only difference is that we apply multiple values against it.<div style="border:1px solid blue;width:200px;">
<p style="border:1px solid orange;margin:40px 10px 1px 40px;">
This text has a different sized margin for each side.
It is nested within a div with a border to make it easier to see the effect of the margin.
</p>
</div>
margin:10px;margin:10px 20px;margin:10px 20px 30px;margin:10px 20px 30px 40px;