m (→Nested Lists) |
m (Text replacement - "\<p(.*?)\>(.*?)\<\/p>" to "<span$1>$2</span>") |
||
| (54 intermediate revisions by 5 users not shown) | |||
| Line 34: | Line 34: | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | ||
#<font color="red"><nowiki><h1></nowiki></font color>Kentucky Genealogy<font color="red"><nowiki></h1></nowiki></font color> | #<font color="red"><nowiki><h1></nowiki></font color>Kentucky Genealogy<font color="red"><nowiki></h1></nowiki></font color> | ||
#<font color="red"><nowiki>< | #<font color="red"><nowiki><h2></nowiki></font color>History<font color="red"><nowiki></h2></nowiki></font color> | ||
#<font color="red"><nowiki>< | #<font color="red"><nowiki><h2></nowiki></font color>Vital Records<font color="red"><nowiki></h2></nowiki></font color> | ||
#<font color="red"><nowiki>< | #<font color="red"><nowiki><h3></nowiki></font color>Birth Certificates<font color="red"><nowiki></h3></nowiki></font color></div> | ||
</div> | </div> | ||
=====Quick Quiz===== | =====Quick Quiz===== | ||
| Line 194: | Line 194: | ||
<nowiki>*[http://www.adairchs.org/ Adair County Historical Society]</nowiki><br> | <nowiki>*[http://www.adairchs.org/ Adair County Historical Society]</nowiki><br> | ||
<nowiki>*[http://www.adairchs.org/FAMILY_HISTORY_ADAIR.pdf Search Your Family History in Adair Co. MO]</nowiki><br> | <nowiki>*[http://www.adairchs.org/FAMILY_HISTORY_ADAIR.pdf Search Your Family History in Adair Co. MO]</nowiki><br> | ||
<nowiki>*[https://familysearch.org | <nowiki>*[https://familysearch.org/wiki/en/Special:Search?</nowiki><br>fulltext=true&search=Kirksville+Missouri+Family+History+Center FamilySearch Center]</nowiki><br> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><font color="red"><nowiki><!--</nowiki></font color>Link to town clerk<font color="red">----------------></font color></div><br> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><font color="red"><nowiki><!--</nowiki></font color>Link to town clerk<font color="red">----------------></font color></div><br> | ||
| Line 207: | Line 207: | ||
</nowiki> | </nowiki> | ||
</div> | </div> | ||
[[Help:Wiki University HTML-- Comments|Back to Comments]] | |||
====Quick Quiz==== | ====Quick Quiz==== | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
| Line 226: | Line 226: | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis. <br><br> | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis. <br><br> | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis. | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis. | ||
*Then with the same paragraph put <font color="red"><nowiki>< | *Then with the same paragraph put <font color="red"><nowiki><span></nowiki></font color> and <font color="red"><nowiki></span></nowiki></font color> between each one. | ||
< | <span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis. </span> | ||
< | <span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis. </span> | ||
< | <span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis. </span> | ||
*<i>Notice the spacing between the paragraphs is almost the same in both problems. However, the paragraph tag allows you to make changes to the paragraph whereas the <font color="red"><nowiki><br></nowiki></font color> will not and which we will cover in the next chapter</i>. | *<i>Notice the spacing between the paragraphs is almost the same in both problems. However, the paragraph tag allows you to make changes to the paragraph whereas the <font color="red"><nowiki><br></nowiki></font color> will not and which we will cover in the next chapter</i>. | ||
</div> | </div> | ||
| Line 236: | Line 236: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*When you load paragraphs, using the enter button will automatically put spaces between them. | *When you load paragraphs, using the enter button will automatically put spaces between them. | ||
:B. False | |||
*It is better to use <font color="red"><nowiki><br></nowiki></font color> than <font color="red"><nowiki><p></nowiki></font color> in separating paragraphs. | *It is better to use <font color="red"><nowiki><br></nowiki></font color> than <font color="red"><nowiki><p></nowiki></font color> in separating paragraphs. | ||
:B. False | |||
*A <font color="red"><nowiki><p></nowiki></font color> does not require an ending tag for the paragraphs to separate like the <font color="red"><nowiki><br></nowiki></font color> | *A <font color="red"><nowiki><p></nowiki></font color> does not require an ending tag for the paragraphs to separate like the <font color="red"><nowiki><br></nowiki></font color> | ||
:B. False | |||
</div> | </div> | ||
[[Help:Wiki University HTML-- Paragraphs|Back to Paragraph Page]] | [[Help:Wiki University HTML-- Paragraphs|Back to Paragraph Page]] | ||
| Line 247: | Line 247: | ||
====Exercises==== | ====Exercises==== | ||
<div style="border:10px solid lightgreen; padding:5px; "> | <div style="border:10px solid lightgreen; padding:5px; "> | ||
< | <span style="font-family:papyrus; font-size:14pt; ">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki>< | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><span style="</nowiki><font color="red">font-family:papyrus; font-size:14pt</font color>">Lorem ipsum ... <nowiki></span></nowiki></div> | ||
< | <span style="font-family:mistral; font-size:14pt; ">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki>< | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><span style="</nowiki><font color="red">font-family:mistral; font-size:14pt</font color>">Lorem ipsum ... <nowiki></span></nowiki></div> | ||
</div> | </div> | ||
| Line 270: | Line 270: | ||
====Exercises==== | ====Exercises==== | ||
<div style="border:10px solid lightgreen; padding:5px; "> | <div style="border:10px solid lightgreen; padding:5px; "> | ||
*Enlarge the lorem ipsum paragraph to | *Enlarge the lorem ipsum paragraph to 20px. | ||
< | <span style="font-size:20px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size: | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:14px; font-family:Courier New"><nowiki><span style="</nowiki><font color="red">font-size:20px</font color>">Lorem ipsum ... <nowiki></span></nowiki></div><br> | ||
*Enlarge a header to | *Enlarge a header to 36px. | ||
<h1 style="font-size: | <h1 style="font-size:36px; margin:0px; padding:0px">Header</h1> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size: | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:14px | ||
; font-family:Courier New"><nowiki><h1 style="</nowiki><font color="red">font-size:36px</font color">">Lorem ipsum ... <nowiki></p></nowiki></div> | |||
</div> | </div> | ||
| Line 294: | Line 295: | ||
*Change the color of a header. | *Change the color of a header. | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki>< | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><span style="</nowiki><font color="red">color:Cornflowerblue</font color>">Lorem ipsum ... <nowiki></span></nowiki></div><br><br> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki>< | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><span style="</nowiki><font color="red">color:#5f9ea0</font color>">Lorem ipsum ... <nowiki></span></nowiki></div><br><br> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><h1 style="</nowiki><font color="red">color:red</font color">>Header<nowiki></h1></nowiki></div> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><h1 style="</nowiki><font color="red">color:red</font color">>Header<nowiki></h1></nowiki></div> | ||
| Line 317: | Line 318: | ||
====Exercises==== | ====Exercises==== | ||
<div style="border:10px solid lightgreen; padding:5px; "> | <div style="border:10px solid lightgreen; padding:5px; "> | ||
*Make the | *Make the first sentence bold. | ||
'''Lorem ipsum dolor sit amet, consectetur adipiscing elit.''' Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.<br> | |||
< | Here is the coding: | ||
<p style="border:1px solid red; padding:5px"> | |||
<font color="red"><nowiki><span style="font-weight:bold"></nowiki></font>Lorum ipsum dolor sit amet, consectetur adipiscing elit.<font color="red"><nowiki></p></nowiki></font> Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.</span> | |||
*Make the next to the last sentence of lorem ipsum italic. | *Make the next to the last sentence of lorem ipsum italic. | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus.''Curabitur eleifend quis ligula ac ullamcorper''. Curabitur eget suscipit turpis. | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus.''Curabitur eleifend quis ligula ac ullamcorper''. Curabitur eget suscipit turpis. | ||
< | <span>Here is the coding</span> | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. | <p style="border:1px solid red; padding:5px"> | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. <font color="red"><nowiki><span style="font-style:etalic"></nowiki></font>Curabitur eleifend quis ligula ac ullamcorper<font color="red"><nowiki></p></nowiki></font>. Curabitur eget suscipit turpis. </span> | |||
*Make the last sentence both bold and italics. | *Make the last sentence both bold and italics. | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. '''''Curabitur eget suscipit turpis'''''. | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. '''''Curabitur eget suscipit turpis'''''. | ||
< | <span>Here is the coding</span> | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. | <div style="border:1px solid red; padding:5px"> | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. <font color="red"><nowiki><span style="font-weight:bold; font-style:etalic"></nowiki></font>Curabitur eget suscipit turpis<font color="red"><nowiki></span></nowiki></font>. </div> | |||
</div> | </div> | ||
====Quick Quiz==== | ====Quick Quiz==== | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*To make a sentence in bold text, you | *To make a sentence in bold text, you use the "text-weight:bold" attribute | ||
::B. False | ::B. False | ||
*To make a word italicized, you flank the | *To make a word italicized, you flank the "text-style:italic attribute | ||
::B. False | ::B. False | ||
</div> | </div> | ||
| Line 346: | Line 350: | ||
====Exercises==== | ====Exercises==== | ||
<div style="border:10px solid lightgreen; padding:5px; "> | <div style="border:10px solid lightgreen; padding:5px; "> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size: | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10px; font-family:Courier New"> | ||
<nowiki>< | <nowiki><span style="</nowiki><font color="red">font-family:arial; font-size:12px; color:red</font color>">Lorem ipsum ....<nowiki></span></nowiki> | ||
</div> | </div> | ||
</div> | </div> | ||
| Line 359: | Line 363: | ||
::D. None of the above | ::D. None of the above | ||
*How would you make a word italicized along with the three attribute changes to the paragraph? | *How would you make a word italicized along with the three attribute changes to the paragraph? | ||
::C. | ::C. Flank the work with two apostrophes. | ||
</div> | </div> | ||
[[Help:Wiki University HTML-- Multi-attributes|Back to Multi-attributes]] | [[Help:Wiki University HTML-- Multi-attributes|Back to Multi-attributes]] | ||
| Line 370: | Line 374: | ||
*What is the coding to change the color of the background of the lorem ipsum paragraph to green and the text to orange. | *What is the coding to change the color of the background of the lorem ipsum paragraph to green and the text to orange. | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki>< | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><span style="</nowiki><font color="red">background-color:green; color:orange</font color>">lorem ipsum ....<nowiki></span></nowiki></div><br> | ||
< | <span style="background-color:green; color:orange">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.</span><br> | ||
*Create a paragraph of your favorite color for the background of the lorem ipsum paragraph and another color for the text from the list of colors. | *Create a paragraph of your favorite color for the background of the lorem ipsum paragraph and another color for the text from the list of colors. | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki>< | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><span style="</nowiki><font color="red">background-color:red; color:gold</font color>">lorem ipsum ....<nowiki></span></nowiki></div><br> | ||
< | <span style="background-color:red; color:gold">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.</span> | ||
</div> | </div> | ||
| Line 384: | Line 388: | ||
====Quick Quiz==== | ====Quick Quiz==== | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*How to make text invisible on a page without erasing it. | |||
:C. All of the above. | |||
</div> | </div> | ||
| Line 394: | Line 398: | ||
====Exercises==== | ====Exercises==== | ||
<div style="border:10px solid lightgreen; padding:5px; "> | <div style="border:10px solid lightgreen; padding:5px; "> | ||
1. What is the coding to | 1. What is the coding to change the background color to light green with blue text and padding on the top and bottom of 20 pixels. | ||
<br> | <br> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki>< | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><span style="</nowiki><font color="red">background-color:lightgreen; color:blue; padding-top:20px; padding-bottom:20px</font color>">Lorem ipsum .....<nowiki></span></nowiki></div><br> | ||
---- | ---- | ||
2. | 2. Copy our lorem ipsum paragraph twice with no background color and no text color but with a <font color="red">padding-bottom</font color> of the first paragraph of 100px. What happens to the space between the paragraphs?<br> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New">< | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><span style="padding-bottom:100px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.</span> | ||
< | <span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.</span></div><br> | ||
*It widens by over 100 pixels. | *It widens by over 100 pixels. | ||
</div> | </div> | ||
| Line 407: | Line 411: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*To have the text 20px from the left edge of the background what attribute do you use? | *To have the text 20px from the left edge of the background what attribute do you use? | ||
:C. padding-left:20px | |||
*To have the background 50px from all side of the text, what attribute do you use? | *To have the background 50px from all side of the text, what attribute do you use? | ||
:C. None of the above</div> | |||
[[Help:Wiki University HTML-- Padding|Back to Padding]] | [[Help:Wiki University HTML-- Padding|Back to Padding]] | ||
| Line 415: | Line 419: | ||
====Exercises==== | ====Exercises==== | ||
<div style="border:10px solid lightgreen; padding:5px; "> | <div style="border:10px solid lightgreen; padding:5px; "> | ||
* | *Copy our lorem ipsum paragraphs twice with the first one with a background color of moccasin and the second one with a color crimson, both with a padding of 20 pixels, but using div tags instead of paragraph tags: | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><div style="</nowiki><font color="red">background-color:moccasin; padding:20px</font color>">Lorem ipsum ... <nowiki></div></nowiki></div><br> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><div style="</nowiki><font color="red">background-color:moccasin; padding:20px</font color>">Lorem ipsum ... <nowiki></div></nowiki></div><br> | ||
| Line 426: | Line 430: | ||
</div> | </div> | ||
[[Help:Wiki University HTML-- Div Tag - Introduction|Back to Div Tag - Introduction]] | |||
====Quick Quiz==== | ====Quick Quiz==== | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*The div tag and paragraph tag | *The div tag and paragraph tag are both have built in margins. | ||
:A. False | |||
*The attributes work the same way in the div tag as in the paragraph tag | *The attributes work the same way in the div tag as in the paragraph tag | ||
:A. True | |||
*Div tags put spaces between paragraphs | *Div tags put spaces between paragraphs | ||
:B. False</div> | |||
[[Help:Wiki University HTML-- Div Tag - Introduction|Back to Div Tag - Introduction]] | [[Help:Wiki University HTML-- Div Tag - Introduction|Back to Div Tag - Introduction]] | ||
==Margins== | ==Margins== | ||
====Exercises==== | ====Exercises==== | ||
<div style="border:10px solid lightgreen; padding:5px; "> | <div style="border:10px solid lightgreen; padding:5px; "> | ||
1. What is the coding to | 1. What is the coding to change our lorem ipsum paragraph in your sandbox with a background color of light green with Purple text and a margin on the bottom of 40 pixels. | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><div style="</nowiki><font color="red">background-color:lightgreen; color: | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><div style="</nowiki><font color="red">background-color:lightgreen; color:Purple; margin-bottom:40px</font color>">Lorem ipsum ....<nowiki></div></nowiki></div><br> | ||
2. | 2. what is the code to change our lorem Ipsum paragraph in your sandbox with a background color of light blue with white text and a margin on the top of 20 pixels. | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><div style="</nowiki><font color="red">background-color:lightblue; color:white; margin-top:20px</font color>">Lorem ipsum ....<nowiki></div></nowiki></div> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><div style="</nowiki><font color="red">background-color:lightblue; color:white; margin-top:20px</font color>">Lorem ipsum ....<nowiki></div></nowiki></div> | ||
| Line 451: | Line 456: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*Margin-top only affects top of paragraph | *Margin-top only affects top of paragraph | ||
:A. True | |||
*Margin-left moves the paragraph to the right of the left side of the page | *Margin-left moves the paragraph to the right of the left side of the page | ||
:A. True | |||
*Margin-right moves the paragraph to the right of the right side of the of the page | *Margin-right moves the paragraph to the right of the right side of the of the page | ||
:B. False | |||
</div> | </div> | ||
[[Help:Wiki University HTML-- Margins|Back to Margins]] | [[Help:Wiki University HTML-- Margins|Back to Margins]] | ||
==Borders== | ==Borders== | ||
====Exercises==== | ====Exercises==== | ||
| Line 627: | Line 633: | ||
| Buckwheat | | Buckwheat | ||
|} | |} | ||
< | <span>Here is the coding in the opening table tag:</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><table </nowiki><font color="red"> style="border:15px ridge cornsilk"</font color>></div><br> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><table </nowiki><font color="red"> style="border:15px ridge cornsilk"</font color>></div><br> | ||
*Put a border for the whole table that is 15 pixels wide, "double" border with a border color of brown. | *Put a border for the whole table that is 15 pixels wide, "double" border with a border color of brown. | ||
| Line 652: | Line 658: | ||
| Buckwheat | | Buckwheat | ||
|} | |} | ||
< | <span>Here is the coding:</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><table</nowiki><font color="red"><nowiki> style="border:15px double brown"</nowiki></font color>></div><br> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><nowiki><table</nowiki><font color="red"><nowiki> style="border:15px double brown"</nowiki></font color>></div><br> | ||
*Put a blue border around the cells in the first column 1 pixel thick. | *Put a blue border around the cells in the first column 1 pixel thick. | ||
| Line 678: | Line 684: | ||
| Buckwheat | | Buckwheat | ||
|} | |} | ||
< | <span>Here is the coding:</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | ||
| Line 754: | Line 760: | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | ||
<nowiki><table style="</nowiki><font color="red">border:25px | <nowiki><table style="</nowiki><font color="red">border:25px inset green; width:90%</font color>"><br> | ||
nowiki><tr></nowiki><br> | <nowiki><tr></nowiki><br> | ||
<nowiki><td style="</nowiki><font color="red">border:1px solid green; width:35%</font color">">Apples<nowiki></td></nowiki><br> | <nowiki><td style="</nowiki><font color="red">border:1px solid green; width:35%</font color">">Apples<nowiki></td></nowiki><br> | ||
<nowiki><td style="</nowiki><font color="red">border:1px solid green; width:15%</font color">">Peas<nowiki></td></nowiki><br> | <nowiki><td style="</nowiki><font color="red">border:1px solid green; width:15%</font color">">Peas<nowiki></td></nowiki><br> | ||
| Line 786: | Line 792: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*Putting the width in the first cell of a row determines the width of the first column in the table | *Putting the width in the first cell of a row determines the width of the first column in the table | ||
:A. True | |||
*The width of a table will be determined by the material in the cells, if you do not set the widths | *The width of a table will be determined by the material in the cells, if you do not set the widths | ||
:A. True | |||
*You can set the width of a table in percentages | *You can only set the width of a table in percentages | ||
:B. False</div> | |||
[[Help:Wiki University HTML-- Tables - Widths|Back to Tables - Widths]] | [[Help:Wiki University HTML-- Tables - Widths|Back to Tables - Widths]] | ||
==Tables - Captions== | ==Tables - Captions== | ||
====Exercises==== | ====Exercises==== | ||
| Line 863: | Line 870: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*The order of attributes is critical. | *The order of attributes is critical. | ||
:B. False | |||
*The caption can only be on the left side of the page | *The caption can only be on the left side of the page | ||
:B. False | |||
*Only margin-bottom of the caption will cause a separation between the caption and the table | *Only margin-bottom of the caption will cause a separation between the caption and the table | ||
:B. False</div> | |||
[[Help:Wiki University HTML-- Tables - Captions|Back to Tables - Captions]] | [[Help:Wiki University HTML-- Tables - Captions|Back to Tables - Captions]] | ||
==Tables - Column headings== | ==Tables - Column headings== | ||
====Exercise==== | ====Exercise==== | ||
| Line 942: | Line 950: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*The headers are always centered on the column. | *The headers are always centered on the column. | ||
:B. False | |||
*You have to use the text-align to put the header on the left side | *You have to use the text-align to put the header on the left side | ||
:B. False | |||
*Headers are always in bold type. | *Headers are always in bold type. | ||
:A. True | |||
</div> | </div> | ||
[[Help:Wiki University HTML-- Tables - Column headings|Back to Tables - Column headings]] | [[Help:Wiki University HTML-- Tables - Column headings|Back to Tables - Column headings]] | ||
| Line 987: | Line 995: | ||
| style="border:1px solid blue; "|Buckwheat | | style="border:1px solid blue; "|Buckwheat | ||
|} | |} | ||
< | <span>Here is the coding</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | ||
| Line 1,027: | Line 1,035: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*Only the border-collaspe attribute is required to separate cell borders. | *Only the border-collaspe attribute is required to separate cell borders. | ||
:B. False | |||
*Padding attribute only pads on the left side of the text | *Padding attribute only pads on the left side of the text | ||
:B. False | |||
*The header font cannot be changed | *The header font cannot be changed | ||
:B. False | |||
</div> | </div> | ||
[[Help:Wiki University HTML-- Tables - Cells|Back to Tables - Rows]] | [[Help:Wiki University HTML-- Tables - Cells|Back to Tables - Rows]] | ||
==Tables - Rows== | ==Tables - Rows== | ||
====Exercises==== | ====Exercises==== | ||
| Line 1,111: | Line 1,120: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*To make all the cells in column the same you need only put the code in the top cell | *To make all the cells in column the same you need only put the code in the top cell | ||
:B. False | |||
*Background color cannot be placed in cells through coding in row | *Background color cannot be placed in cells through coding in row | ||
:B. False | |||
*You can change the font-family in the rows | *You can change the font-family in the rows | ||
:A. True | |||
</div> | </div> | ||
[[Help:Wiki University HTML-- Tables - Rows|Back to Tables - Rows]] | [[Help:Wiki University HTML-- Tables - Rows|Back to Tables - Rows]] | ||
| Line 1,161: | Line 1,170: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*Text will always float up to the right side of a table when placing a table on the page. | *Text will always float up to the right side of a table when placing a table on the page. | ||
:B. False | |||
*Text will float when you place a table on the right side of a page. | *Text will float when you place a table on the right side of a page. | ||
:A. True | |||
*You cannot place a table in the middle of the page. | *You cannot place a table in the middle of the page. | ||
:B. False | |||
</div> | </div> | ||
[[Help:Wiki University HTML-- Tables - Placement|Back to Tables - Placement]] | [[Help:Wiki University HTML-- Tables - Placement|Back to Tables - Placement]] | ||
==Tables - Sorting== | ==Tables - Sorting== | ||
====Exercises==== | ====Exercises==== | ||
| Line 1,246: | Line 1,256: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*When you click the sorting icon, the sorting is permanent. | *When you click the sorting icon, the sorting is permanent. | ||
:B. False | |||
*When you add items to a table, you need to insert the item in the table where it is supposed to go if you want your table in alphabetical order even with the sorting class applied. | *When you add items to a table, you need to insert the item in the table where it is supposed to go if you want your table in alphabetical order even with the sorting class applied. | ||
:B. False | |||
*Sorting will revert back to the original order if you leave the page the table is on. | *Sorting will revert back to the original order if you leave the page the table is on. | ||
:A. True | |||
</div> | </div> | ||
[[Help:Wiki University HTML-- Tables - Sorting|Back to Tables - Sorting]] | [[Help:Wiki University HTML-- Tables - Sorting|Back to Tables - Sorting]] | ||
==Tables - Scrolling== | ==Tables - Scrolling== | ||
====Exercises==== | ====Exercises==== | ||
| Line 1,288: | Line 1,299: | ||
|} | |} | ||
</div><br> | </div><br> | ||
< | <span>Here is the coding:</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><font color="red"><nowiki><div style="overflow:scroll; width:400px; height:400px; "></nowiki></font color><br> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"><font color="red"><nowiki><div style="overflow:scroll; width:400px; height:400px; "></nowiki></font color><br> | ||
<nowiki><table style="border:1px solid red; width:900px; height:900px"></nowiki><br> | <nowiki><table style="border:1px solid red; width:900px; height:900px"></nowiki><br> | ||
| Line 1,304: | Line 1,315: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*When creating the horizontal scroll bar, you do not have to set the width. | *When creating the horizontal scroll bar, you do not have to set the width. | ||
:B. False | |||
*Vertically scroll bars are only useful for very tall tables. | *Vertically scroll bars are only useful for very tall tables. | ||
:A. True | |||
*You cannot have horizontal and vertical scroll bars at the same time. | *You cannot have horizontal and vertical scroll bars at the same time. | ||
:B. False | |||
</div> | </div> | ||
| Line 1,387: | Line 1,398: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*To have a list of items in six columns you need to create a table with one row and six cells. | *To have a list of items in six columns you need to create a table with one row and six cells. | ||
:B. True | |||
*A one row table looks better if the columns are of equal length. | *A one row table looks better if the columns are of equal length. | ||
:A. True | |||
*To make the items on separate lines, you use <nowiki><p></nowiki> tags only. | *To make the items on separate lines, you use <nowiki><p></nowiki> tags only. | ||
:B. False</div> | |||
[[Help:Wiki University HTML-- Tables - Columns Only|Back to Tables - Columns Only]] | [[Help:Wiki University HTML-- Tables - Columns Only|Back to Tables - Columns Only]] | ||
| Line 1,423: | Line 1,434: | ||
|} | |} | ||
< | <span>Here is the coding</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | ||
<nowiki><table style="border:1px solid red; width:100%"></nowiki><br> | <nowiki><table style="border:1px solid red; width:100%"></nowiki><br> | ||
| Line 1,459: | Line 1,470: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*Colspans must equal the number of cells in the next row. | *Colspans must equal the number of cells in the next row. | ||
:A. True | |||
*If you have a row with four cells you can have in the preceding row one cell with a colspan="3" plus the remaining cell. | *If you have a row with four cells you can have in the preceding row one cell with a colspan="3" plus the remaining cell. | ||
:A. True | |||
*If you have a row of seven cells you can have in the preceding row one cell with a colspan="2", the next cell with a colspan="3" and the remaining cell with a colspan="2". | *If you have a row of seven cells you can have in the preceding row one cell with a colspan="2", the next cell with a colspan="3" and the remaining cell with a colspan="2". | ||
:A. True | |||
</div> | </div> | ||
[[Help:Wiki University HTML-- Tables - Columns Only|Back to Tables - Column Spans]] | [[Help:Wiki University HTML-- Tables - Columns Only|Back to Tables - Column Spans]] | ||
==Tables - Row Spans== | ==Tables - Row Spans== | ||
====Exercises==== | ====Exercises==== | ||
| Line 1,471: | Line 1,483: | ||
*Merge the cells with Barley and Buckwheat in them. | *Merge the cells with Barley and Buckwheat in them. | ||
*Merge the cells with Peas, Carrots and Corn in them. | *Merge the cells with Peas, Carrots and Corn in them. | ||
< | <span>Here is what the table should look like:</span> | ||
{| style="border:1px solid red; width:100%; " | {| style="border:1px solid red; width:100%; " | ||
|+ style="font-size: | |+ style="font-size:14px; text-align:center; " | Healthy Foods | ||
|- | |- | ||
! style="width:25%; text-align:center; border:1px solid red; " | Fruits | ! style="width:25%; text-align:center; border:1px solid red; " | Fruits | ||
| Line 1,498: | Line 1,510: | ||
|} | |} | ||
< | <span>Here is the coding:</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | ||
<nowiki><table style="border:1px solid red; width:100%"></nowiki><br> | <nowiki><table style="border:1px solid red; width:100%"></nowiki><br> | ||
<nowiki><caption style="font-size: | <nowiki><caption style="font-size:14px; text-align:center">Healthy Foods</caption></nowiki><br> | ||
<nowiki><tr></nowiki><br> | <nowiki><tr></nowiki><br> | ||
<nowiki><th style="border:1px solid red; text-align:center; width:25%">Fruits</th></nowiki><br> | <nowiki><th style="border:1px solid red; text-align:center; width:25%">Fruits</th></nowiki><br> | ||
| Line 1,536: | Line 1,548: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*If you are going to merge three cells in a column, you must delete the number of cells in the column under the cell to be marged to equal the number call for in the rowspan code minus one. | *If you are going to merge three cells in a column, you must delete the number of cells in the column under the cell to be marged to equal the number call for in the rowspan code minus one. | ||
:A. True | |||
*If you want to merge two cells that are under each other in a column, you delete the cell next it in the row. | *If you want to merge two cells that are under each other in a column, you delete the cell next it in the row. | ||
:B. False | |||
</div> | </div> | ||
[[Help:Wiki University HTML-- Tables - Row Spans|Back to Table - Row Spans]] | [[Help:Wiki University HTML-- Tables - Row Spans|Back to Table - Row Spans]] | ||
| Line 1,550: | Line 1,562: | ||
*Center the name of the organization and the image in their cells. | *Center the name of the organization and the image in their cells. | ||
*Make the items in the right hand cells into parameters. | *Make the items in the right hand cells into parameters. | ||
< | <span>Your coding should look like this:</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | ||
| Line 1,562: | Line 1,574: | ||
<nowiki><tr></nowiki><br> | <nowiki><tr></nowiki><br> | ||
<nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>">President:<nowiki></td></nowiki><br> | <nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>">President:<nowiki></td></nowiki><br> | ||
<nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>">{{{president}}}<nowiki></td></nowiki><br> | <nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>"><nowiki>{{{president</nowiki><font color="red">|President's name</font color>}}}<nowiki></td></nowiki><br> | ||
<nowiki></tr></nowiki><br> | <nowiki></tr></nowiki><br> | ||
<nowiki><tr></nowiki><br> | <nowiki><tr></nowiki><br> | ||
<nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>">Address:<nowiki></td></nowiki><br> | <nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>">Address:<nowiki></td></nowiki><br> | ||
<nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>">{{{address}}}<nowiki></td></nowiki><br> | <nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>"><nowiki>{{{address</nowiki><font color="red">|Address</font color>}}}<nowiki></td></nowiki><br> | ||
<nowiki></tr></nowiki><br> | <nowiki></tr></nowiki><br> | ||
<nowiki><tr></nowiki><br> | <nowiki><tr></nowiki><br> | ||
<nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>">Phone:<nowiki></td></nowiki><br> | <nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>">Phone:<nowiki></td></nowiki><br> | ||
<nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>">{{{phone}}}<nowiki></td></nowiki><br> | <nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>"><nowiki>{{{phone</nowiki><font color="red">|Phone number</font color>}}}<nowiki></td></nowiki><br> | ||
<nowiki></tr></nowiki><br> | <nowiki></tr></nowiki><br> | ||
<nowiki><tr></nowiki><br> | <nowiki><tr></nowiki><br> | ||
<nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>">Hours Open:<nowiki></td></nowiki><br> | <nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>">Hours Open:<nowiki></td></nowiki><br> | ||
<nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>">{{{hours open}}}<nowiki></td></nowiki><br> | <nowiki><td style="</nowiki><font color="red">border:1px solid black</font color>"><nowiki>{{{hours open</nowiki><font color="red">|Hours open</font color>}}}<nowiki></td></nowiki><br> | ||
<nowiki></tr></nowiki><br> | <nowiki></tr></nowiki><br> | ||
<nowiki></table></nowiki></div> | <nowiki></table></nowiki></div> | ||
| Line 1,582: | Line 1,594: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*Parameters have two opening and closing curly brackets surrounding them. | *Parameters have two opening and closing curly brackets surrounding them. | ||
:A. False | |||
*Infoboxes are usually located at the top of the page on the right side. | *Infoboxes are usually located at the top of the page on the right side. | ||
:A. True | |||
*Infoboxes are saved just like other templates, but it is good practice to include the word "infobox" in the title. | *Infoboxes are saved just like other templates, but it is good practice to include the word "infobox" in the title. | ||
:A. True | |||
</div> | </div> | ||
[[Help:Wiki University HTML--Infobox - Creating|Back to Infobox - Creating]] | [[Help:Wiki University HTML--Infobox - Creating|Back to Infobox - Creating]] | ||
| Line 1,595: | Line 1,607: | ||
<div style="clear:both"></div> | <div style="clear:both"></div> | ||
< | <span>Here is the coding:</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | ||
<nowiki>{{Infobox U.S. County</nowiki><br> | <nowiki>{{Infobox U.S. County</nowiki><br> | ||
| Line 1,625: | Line 1,637: | ||
<div style="clear:both"></div> | <div style="clear:both"></div> | ||
< | <span>Here is the coding:</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | ||
| Line 1,674: | Line 1,686: | ||
<div style="clear:both"></div> | <div style="clear:both"></div> | ||
< | <span>Here is the coding:</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | ||
<nowiki>{{Infobox U.S. County</nowiki><br> | <nowiki>{{Infobox U.S. County</nowiki><br> | ||
| Line 1,690: | Line 1,702: | ||
<div style="border:10px solid lightgray; padding:5px; "> | <div style="border:10px solid lightgray; padding:5px; "> | ||
*Once the information after the equal signs is entered and saved, there is no changing the parameters. | *Once the information after the equal signs is entered and saved, there is no changing the parameters. | ||
:B. False | |||
*Infoboxes can only be used on county pages. | *Infoboxes can only be used on county pages. | ||
:B. False | |||
*Infoboxes are limited just to genealogical organizations. | *Infoboxes are limited just to genealogical organizations. | ||
:B. False | |||
</div> | </div> | ||
[[Help:Wiki University HTML--Sidebars|Back to Sibebars]] | [[Help:Wiki University HTML--Sidebars|Back to Sibebars]] | ||
| Line 1,706: | Line 1,718: | ||
*For Counties use the first 5 counties from the [[Anhalt_-_Herzogtum_(duchy)]] navbox at the bottom of the page. | *For Counties use the first 5 counties from the [[Anhalt_-_Herzogtum_(duchy)]] navbox at the bottom of the page. | ||
*Change the parameter to country. | *Change the parameter to country. | ||
< | <span>Here's what it should look like:</span> | ||
{| style="width:100%; border:1px solid black; border-collaspe:separate; border-spacing:5px; " | {| style="width:100%; border:1px solid black; border-collaspe:separate; border-spacing:5px; " | ||
|- | |- | ||
| Line 1,717: | Line 1,729: | ||
| style="background-color:lightblue; " | [[Anhalt - Herzogtum (duchy) Genealogy|Anhalt]]{{·}} [[Baden Grossherzogtum (grand duchy) Genealogy|Baden]]{{·}} [[Bayern (Bavaria) – Königreich (kingdom) Genealogy|Bayern]]{{·}} [[Braunschweig (Brunswick) – Herzogtum (duchy) Genealogy|Braunschweig]]{{·}} [[Bremen, Germany Genealogy|Bremen]] | | style="background-color:lightblue; " | [[Anhalt - Herzogtum (duchy) Genealogy|Anhalt]]{{·}} [[Baden Grossherzogtum (grand duchy) Genealogy|Baden]]{{·}} [[Bayern (Bavaria) – Königreich (kingdom) Genealogy|Bayern]]{{·}} [[Braunschweig (Brunswick) – Herzogtum (duchy) Genealogy|Braunschweig]]{{·}} [[Bremen, Germany Genealogy|Bremen]] | ||
|} | |} | ||
< | <span>Here's what the code should look like:</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | ||
<nowiki>{| style="width:100%; border:1px solid black; border-collaspe:separate; border-spacing:5px; "</nowiki><br> | <nowiki>{| style="width:100%; border:1px solid black; border-collaspe:separate; border-spacing:5px; "</nowiki><br> | ||
| Line 1,746: | Line 1,758: | ||
*Place a "relative" positioned object that is 300 pixels wide and 100 pixels high between the third and fourth sentence of our Lorem ipsum paragraph. | *Place a "relative" positioned object that is 300 pixels wide and 100 pixels high between the third and fourth sentence of our Lorem ipsum paragraph. | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.<div style="position:relative; width:300px; height:100px"></div> Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.<br><br> | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.<div style="position:relative; width:300px; height:100px"></div> Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.<br><br> | ||
< | <span>Here is the coding:</span> | ||
<div style="background-color: | <div style="border:2px solid crimson; background-color:moccasinpadding:10px; width:97%; font-size:10pt; font-family:Courier New">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.<font color="red"><nowiki><div style="position:relative;</nowiki></font color><font color="red"> width:300px; height:100px"></font color><font color="red"><nowiki></div></nowiki></font color>Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.</div> | ||
---- | ---- | ||
*Place a "relative" positioned object after the last sentence that has the following attributes: | *Place a "relative" positioned object after the last sentence that has the following attributes: | ||
| Line 1,755: | Line 1,767: | ||
**that is 200 pixels high. | **that is 200 pixels high. | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.<div style="position:relative; width 100%; height:200px; background-color:blue; border:5px solid red"></div><br> | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.<div style="position:relative; width 100%; height:200px; background-color:blue; border:5px solid red"></div><br> | ||
< | <span>Here is the coding:</span> | ||
<div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.<font color="red"><nowiki><div style="position:relative;</nowiki></font color><font color="red"> width:100%; height:200px; background-color:blue; border:5px solid red"></font color><font color="red"><nowiki></div></nowiki></font color></div> | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.<font color="red"><nowiki><div style="position:relative;</nowiki></font color><font color="red"> width:100%; height:200px; background-color:blue; border:5px solid red"></font color><font color="red"><nowiki></div></nowiki></font color></div> | ||
| Line 1,786: | Line 1,798: | ||
</div></div><br><br><br><br> | </div></div><br><br><br><br> | ||
Here is the coding:<br> | Here is the coding:<br> | ||
<div style="background-color: | <div style="border:2px solid crimson; background-color:moccasin; padding:10px; width:97%; font-size:10pt; font-family:Courier New"> | ||
<nowiki><div style="position:relative; </nowiki><font color="red"> left:150px; top:50px;</font color><nowiki>border:1px solid red; width:400px; height:200px; "></nowiki><br><nowiki><div style="position:absolute; left:0px; top:0px; width:200px; height:75px; border:2px solid green; background-color:orange; "></nowiki> | <nowiki><div style="position:relative; </nowiki><font color="red"> left:150px; top:50px;</font color><nowiki>border:1px solid red; width:400px; height:200px; "></nowiki><br><nowiki><div style="position:absolute; left:0px; top:0px; width:200px; height:75px; border:2px solid green; background-color:orange; "></nowiki> | ||
<nowiki></div></nowiki><br> | <nowiki></div></nowiki><br> | ||
| Line 1,857: | Line 1,869: | ||
</div> | </div> | ||
[[Help:Wiki University HTML--Tabs|Back to Tabs]] | [[Help:Wiki University HTML--Tabs|Back to Tabs]] | ||
==Misc== | |||
====Quick Quiz==== | |||
<div style="border:10px solid lightgray; padding:5px; "> | |||
*If I want to copy the name of the article someplace in the article, you would use <nowiki>[[NAMESPACE]]</nowiki> | |||
:A. True | |||
*To recover something you may have deleted accidentally, you would hit the control key and the D key. | |||
:B. False ''(Control + Z)'' | |||
*To search for a word in an article, you would hit the control key and the S key. | |||
:B. False ''(Control + F)'' | |||
*To highlight an entire page, you would bit the Control and W key | |||
:B. False ''(Control + A)'' | |||
*If you want exhibit code in an article, you would use opening and closing noinclude tags. | |||
:B. False ''(<nowiki><nowiki> ..... </nowiki></nowiki>)'' | |||
</div> | |||
[[Help:Wiki University HTML-- Misc|Back to Misc]] | |||
[[Category:HTML Lessons]] | [[Category:HTML Lessons]] | ||
edits