Advanced Wikiediting/Tables
If you want to start with just a few simple examples, go to: Help:Table.
Table of contents
[edit | edit source]
Simple Example 1
[edit | edit source]{{center top}}
{| border=1 cellspacing=5 cellpadding=5
| This
| is
|-
| a
| '''table'''
|}
{{center bottom}}
| This | is |
| a | table |
.
Simple Example 2
[edit | edit source]{{center top}}
{| border=1 cellspacing=0 cellpadding=5|| style="width:200px"
| bgcolor="#ccff99" | This
| bgcolor="#ececec" | is
|-
| bgcolor="#99ccff" | a
| bgcolor="red" | {{font|color=green|{{center top}}'''table'''{{center bottom}}}}
|}
{{center bottom}}
| This | is |
| a | table |
.
Simple Example 3
[edit | edit source]{{center top}}
{| bgcolor="whitesmoke" style="border: DarkGreen solid 1px; text-align: center;"
|- style="color: black;"
| bgcolor="red" |TOP LEFT
| bgcolor="yellow" |TOP RIGHT
|- style="color: white;"
| bgcolor="green" |BOTTOM LEFT
| bgcolor="blue" |BOTTOM RIGHT
|}
{{center bottom}}
| TOP LEFT | TOP RIGHT |
| BOTTOM LEFT | BOTTOM RIGHT |
.
Simple Example 4
[edit | edit source]{{center top}}
{| border="5" cellspacing="5" cellpadding="2" width="300"
| style="text-align: right;" | This is right!
|-
| style="text-align: center;" | This is center.
|-
| style="text-align: left;" | This is left.
|-
| style="text-align: justify;" | This is justified text and then more text and then more text and then even more text but always text, text, and text. As you can see, it is perfectly justified but are you justified in using justified text.
|}
{{center bottom}}
| This is right! |
| This is center. |
| This is left. |
| This is justified text and then more text and then more text and then even more text but always text, text, and text. As you can see, it is perfectly justified but are you justified in using justified text. |
.
Simple Example 5
[edit | edit source]<div align="left"> text </div> <div align="center"> text </div> <div align="right"> text </div>
text
text
text
.
Simple Example 6
[edit | edit source]
|
{| border="1" cellpadding="4" cellspacing="0"
| The quick
|rowspan="2"| brown<br>fox<br>jumped
|-
| over the
|-
|colspan="2"| slow lazy dog.
|}
| |||||
.
Simple Example 7
[edit | edit source]
|
{| border="1" cellpadding="4" cellspacing="0"
| The quick
|rowspan="4"| brown<br>fox<br>jumped
|-
| over
|-
| the
|-
| slow
|-
|colspan="2"| and lazy dog.
|}
|
| ||||||||||||||
.
Practical Example 1
[edit | edit source]A useful location finder for all Wikiversity pages.
{{center top}}
{| style="float: center; border: 1px #cccccc solid;"
|-
| colspan="2" align="center" bgcolor="#99ccff" | Your Current Location
|-
| bgcolor="#ccff99" | Page:
| style="border: 1px #cccccc solid;" | '''Introduction'''
|-
| bgcolor="#ccff99" | Lesson:
| style="border: 1px #cccccc solid;" | [[Filmmaking Basics/Thumbnail Storyboard|Lesson #004: Thumbnail Storyboards]]
|-
| bgcolor="#ccff99" | Course:
| style="border: 1px #cccccc solid;" | [[Filmmaking Basics|Course #01 - Basic Filmmaking]]
|-
| bgcolor="#ccff99" | Department:
| style="border: 1px #cccccc solid;" | [[Filmmaking|Narrative Film Production]]
|-
| bgcolor="#ccff99" | Division:
| style="border: 1px #cccccc solid;" | [[Portal:Film and television|Film and Television]]
|-
| bgcolor="#ccff99" | Portal:
| style="border: 1px #cccccc solid;" | [[Portal:Arts|Portal:Fine Arts]]
|-
| bgcolor="#ccff99" | School:
| style="border: 1px #cccccc solid;" | [[School:Art and Design|Art and Design]]
|-
| bgcolor="#ccff99" | Faculty:
| style="border: 1px #cccccc solid;" | [[Portal:Humanities|Humanities]]
|-
| bgcolor="#ccff99" | University:
| style="border: 1px #cccccc solid;" | [[Wikiversity:Main Page | Wikiversity (English)]]
|}
{{center bottom}}
| Your Current Location | |
| Page: | Introduction |
| Lesson: | Lesson #004: Thumbnail Storyboards |
| Course: | Course #01 - Basic Filmmaking |
| Department: | Narrative Film Production |
| Division: | Film and Television |
| Portal: | Portal:Fine Arts |
| School: | Art and Design |
| Faculty: | Humanities |
| University: | Wikiversity (English) |
.
Practical Example 2
[edit | edit source]Table of contents
__NOTOC__
{{center top}}
{| border=1 cellspacing=0 cellpadding=30 bordercolor="yellow" width="94%"
| bgcolor="#ffffe0" |
; [[Music in film|Topic:Music in Film]]:
:[[Film Scoring|Mad Max's Course in Film Scoring for Motion Pictures]]
;Lesson:[[Image:Crystal Clear app knotify.png|right|200px]]
:[[Film Scoring/Melody/Creating the sound of fear|Lesson #01: Creating the sound of "Fear"]]
;Pages of this Lesson:
:{| cellpadding="4" cellspacing="0" width="350px"
| bgcolor="#eeeeff" style="border: 1px #cccccc solid;" |Page 1: [[Film Scoring/Melody/Creating the sound of fear|Introduction - The Secret of Motion Pictures]]
|}
:{| cellpadding="4" cellspacing="0" width="350px"
| bgcolor="#eeeeff" style="border: 1px #cccccc solid;" |Page 2: [[Film Scoring/Theory of Film Scoring/What is Narrative Music?|What is narrative music?]]
|}
:{| cellpadding="4" cellspacing="0" width="350px"
| bgcolor="#eeeeff" style="border: 1px #cccccc solid;" |Page 3: [[Mad Max's - Computer Set Up for Film Scoring | What computer software do I need?]]
|}
:{| cellpadding="4" cellspacing="0" width="350px"
| bgcolor="#eeeeff" style="border: 1px #cccccc solid;" |Page 4: [[GarageBand/Getting Started|Getting started with GarageBand]]
|}
:{| cellpadding="4" cellspacing="0" width="350px"
| bgcolor="#eeeeff" style="border: 1px #cccccc solid;" |Page 5: [[Mad Max's - Assignments in Film Scoring | List of moods and actions for you to work on]]
|}
:{| cellpadding="4" cellspacing="0" width="350px"
| bgcolor="#eeeeff" style="border: 1px #cccccc solid;" |Page 6: [[Mad Max's - Student's Narrative Music | Narrative music created by Mad Max's students]]
|}
:{| cellpadding="4" cellspacing="0" width="350px"
| bgcolor="#f0ffff" style="border: 1px #cccccc solid;" |Supplemental A: [[Film Scoring/Theory of Film Scoring/Examples of Narrative Music|Examples of Narrative Music]]
|}
:{| cellpadding="4" cellspacing="0" width="350px"
| bgcolor="#f0ffff" style="border: 1px #cccccc solid;" |Supplemental B: [[Film Scoring/Movie Scoring Projects|A simple movie for scoring]]
|}
|}
{{center bottom}}
|
.
Practical Example 3
[edit | edit source]{{center top}}
{| border=1 cellspacing=0 cellpadding=10
| colspan="2" align="center" bgcolor="#ccfffe" | This lesson should take '''only 15 minutes''' to draw the thumbnail storyboards with pencil and paper. <!--If you spend more than this, you are trying too hard.-->
|-
| bgcolor="#ffff99" |
{{center top}}<big> Problem </big>{{center bottom}}
| bgcolor="#ffffdd" |
It takes too long to get the thumbnail drawings into the computer.
|-
| bgcolor="#99ffff" |
{{center top}}<big> Solution #1</big>{{center bottom}}
| bgcolor="#eeffff" |
Mail me your pencil and paper storyboard sketches.
|-
| bgcolor="#99ffff" |
{{center top}}<big> Solution #2</big>{{center bottom}}
| bgcolor="#eeffff" |
Tell me the numbers of the [[Filmmaking Basics/Thumbnail Storyboard/Storyboard frames|Thumbnail Examples]] which match your storyboards.
|}
{{center bottom}}
| This lesson should take only 15 minutes to draw the thumbnail storyboards with pencil and paper. | |
|
Problem
|
It takes too long to get the thumbnail drawings into the computer. |
|
Solution #1
|
Mail me your pencil and paper storyboard sketches. |
|
Solution #2
|
Tell me the numbers of the Thumbnail Examples which match your storyboards. |
.
Practical Example 5
[edit | edit source]This is a film strip.
{| cellpadding="0" cellspacing="5" style="width: 500px; background-color: #e0e0ff; margin-left: auto; margin-right: auto"
| style="width: 100%; background-color: white; border: 1px solid #777777; vertical-align: top; -moz-border-radius-topleft: 8px; -moz-border-radius-bottomleft: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px;" |
{| cellpadding="0" cellspacing="0" style="width: 100%; height: 4px; background-color: inherit"
|}
{| cellpadding="0" cellspacing="0" style="width: 600px; height: 10px; background-color: inherit"
{{Film strip holes artwork table}}
|}
{| cellpadding="0" cellspacing="0" style="width: 100%; height: 4px; background-color: inherit"
|}
{| cellpadding="0" cellspacing="1" style="width: 100%; height: 80px; background-color: inherit"
| style="background-color: #ffffe0; border: 1px solid #777777; width: 20%; height: 20px;" |{{center top}}1031{{center bottom}}
| style="background-color: white; border: 1px solid #777777; width: 60%;" |
| style="background-color: #ffffe0; border: 1px solid #777777; width: 20%;" |{{center top}}1075{{center bottom}}
|}
{| cellpadding="0" cellspacing="0" style="width: 600px; height: 4px; background-color: inherit"
|}
{| cellpadding="0" cellspacing="0" style="width: 600px; height: 10px; background-color: inherit"
{{Film strip holes artwork table}}
|}
{| cellpadding="0" cellspacing="0" style="width: 100%; height: 4px; background-color: inherit"
|}
|}
|
Practical Example 6
[edit | edit source]This is an empty table.
{{center top}}
{| border=1 cellspacing=0 cellpadding=10 width="90%" style="border: orangered solid 4px; text-align: center;"
| style="width: 40%; background-color: #ffffe0; border: 4px solid blue;"| Text
|}
{{center bottom}}
| Text |
---
.
---
.
Practical Example 8
[edit | edit source]This is tables within a table.
{| cellpadding="10" cellspacing="5" style="width: 95%; background-color: inherit; margin-left: auto; margin-right: auto"
| style="width: 60%; background-color: #ffffe0; border: 1px solid #777777; vertical-align: top; -moz-border-radius-topleft: 8px; -moz-border-radius-bottomleft: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px;" rowspan="2" |
[[File:Crystal128-staroffice.svg|right|128px]]
==Left==
| style="width: 40%; background-color: #e0e0ff; border: 1px solid #777777; vertical-align: top; -moz-border-radius-topleft: 8px; -moz-border-radius-bottomleft: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px; height: 10px;" |
[[Image:Crystal Clear app windows users.png|right|128px]]
==Right==
|}
 Left[edit | edit source] |
 Right[edit | edit source] |
.
Practical Example 9
[edit | edit source]A simple framework
{| cellpadding="10" cellspacing="5" style="width: 95%; background-color: inherit; margin-left: auto; margin-right: auto"
! style="background-color: #ffffaa; border: 1px solid #777777; -moz-border-radius-topleft: 8px; -moz-border-radius-bottomleft: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px;" colspan="2" | Title
|-
| style="width: 60%; background-color: #ffffe0; border: 1px solid #777777; vertical-align: top; -moz-border-radius-topleft: 8px; -moz-border-radius-bottomleft: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px;" rowspan="2" |
== Left ==
| style="width: 40%; background-color: #EFFFEF; border: 1px solid #777777; vertical-align: top; -moz-border-radius-topleft: 8px; -moz-border-radius-bottomleft: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px; height: 10px;" |
== Right ==
|}
{| cellpadding="10" cellspacing="5" style="width: 95%; background-color: inherit; margin-left: auto; margin-right: auto"
| style="background-color: #e0e0ff; border: 1px solid #777777; -moz-border-radius-topleft: 8px; -moz-border-radius-bottomleft: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px;" colspan="2" |
==Full==
|}
{| cellpadding="10" cellspacing="5" style="width: 95%; background-color: inherit; margin-left: auto; margin-right: auto"
| style="background-color: white; border: 1px solid #777777; -moz-border-radius-topleft: 8px; -moz-border-radius-bottomleft: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px;" colspan="2" |
==Full 2==
|}
| Title | |
|---|---|
Left[edit | edit source] |
Right[edit | edit source] |
Full[edit | edit source] |
Full 2[edit | edit source] |
.
Practical Example 11
[edit | edit source]<div style="margin-left: auto; margin-right: auto; width:80%"> <div style="background-color:#f7f8ff; text-align:justify; padding:5px; border:1px solid #8888aa; border-right-width:2px; border-bottom-width:2px; margin-bottom:2em" > [[Image:Crystal_Clear_app_kaddressbook.png|left|50px|Please help]] Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text. </div> </div>
Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text.
Picture is 150px rather than 50px.
Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text.
Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text.
Practical Example 12
[edit | edit source]{{center top}}
{| cellpadding="3" cellspacing="0"
| style="background:red; color:blue" | .
| style="background:red; color:white" | <big>Start Here: </big>
| style="background:red; color:red" | .
| style="background:#fffff0; color:red" | →
| style="background:#ffffff; border: 3px solid yellow; vertical-align: top; -moz-border-radius-topleft: 4px; -moz-border-radius-bottomleft: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 4px;" | <big>[[Filmmaking Basics/Formatting the Script|First lesson: Formatting the movie script]].</big>
|}
{{center bottom}}
| . | Start Here: | . | → | First lesson: Formatting the movie script. |
.
Second page of this help page for tables