css for designers - lesson 1 - html

CSS for designers

the Web Standards approach

content

representation

HTML

CSS

content + markup

representation = layout + style


HTML

CSS

JS

content + markup


interactionetc


HTML

CSS

JS

content + markup


interactionetc


HTMLLesson I

HTMLLesson I

Hyper Text Markup Language

HTMLLesson I

Hyper Text Markup LanguageHyper Text Markup Language

HTMLLesson I

Hyper Text Markup LanguageHyper Text Markup Language

The son of Brahman

In the shade of the house, in the sunshine of the riverbank

near the boats, in the shade of the Sal-wood forest

The young falcon, together with his friend Govinda Brahman.

The sun tanned his light shoulders by the banks of the river

when bathing, performing the sacred ablutions, the sacred

offerings. In the mango grove, shade poured into his black

eyes, when playing as a boy, when his mother sang, when

the sacred offerings were made, when his father, the

scholar, taught him, when the wise men talked. For a long

time, Siddhartha had been partaking in the

Next

Title Subtitle Paragraph

<trumpet> Miles Davis </trumpet>

<trumpet> Miles Davis </trumpet>

content

tag closing tag

<bigband> <trumpet> Miles Davis </trumpet></bigband>

<bigband> <trumpet> Miles Davis <trumpet> <sax> Coltrane </sax></bigband>

<html>

<head> ... </head>

<body> ... </body>

</html>

setup

mmm.... the rest

<html> <head> <title>Thelonious Monk</title> </head>

<body> ... </body></html>

http://www.w3schools.com/tags/tag_title.asp

<html> <head> <title>Thelonious Monk</title> <meta name="description" content="Stuff about monk" /> </head>

<body> ... </body></html>

http://www.w3schools.com/tags/tag_meta.asp

http://www.w3schools.com/tags/default.asp

aabbracronymaddressareabbasebdobigblockquotebodybrbuttoncaptioncitecodecolclogroupdd

deldfmdivdlDOCTYPEdtemfieldsetformh1, h2, h2, h4,h5, h6headhtmlhriimginputinskbd

labellegendlilinkmapmetanoscriptobjectoloptgroupoptionpparampreqsampscriptselectsmall

spanstrongstylesubsuptabletbodytdtextareatfootththeadtitletrttulvar

<html>

<head> <title>Thelonious Monk</title></head>

<body> <h1>>Thelonious Monk</h1> <h2>"All musicians are subconsciously mathematicians."</h2>

<img src="http://farm5.static.flickr.com/4144/4843138893_c6b201769b.jpg">

<p> Thelonious Monk was born October 10, 1917 in Rocky Mount, North Carolina, the son of Thelonious and Barbara Monk, two years after his sister Marion. A brother, Thomas, was born in January 1920.[8] In 1922, the family moved to 243 West 63rd Street, in Manhattan, New York City. Monk started playing the piano at the age of six. Although he had some formal training and eavesdropped on his sister's piano lessons, he was largely self-taught. Monk attended Stuyvesant High School, but did not graduate. He toured with an evangelist in his teens, playing the church organ, and in his late teens he began to find work playing jazz.<br> <a href="http://en.wikipedia.org/wiki/Thelonious_Monk" target="_blank">Wikipedia value</a> </p>

<h2>Discography</h2>

<h3>Blue Note Records (1948-1952)</h3> <ul> <li>Genius of Modern Music: Volume 1</li> <li>Genius of Modern Music: Volume 2</li> <li>Thelonious Monk Trio</li> <li>>Monk (Prestige 7053)</li> <li>Thelonious Monk and Sonny Rollins (Prestige 7075)</li> </ul>

<h3>Misc Records</h3> <ul> <li>Thelonious Monk plays the Music of Duke Ellington (1955)</li> <li>The Unique Thelonious Monk (1955)</li> <li>Brilliant Corners (1956 recording with Sonny Rollins and Clark Terry)</li> <li>Thelonious Himself (1957)</li> <li>Tonk's Music (1957)</li> </ul>

<h2>Videos</h2> <iframe width="420" height="315" src="http://www.youtube.com/embed/OMmeNsmQaFw" frameborder="0" allowfullscreen></iframe></body>

</html>

H1H2H3H4H5

H6Header of varying importancehttp://www.w3schools.com/TAGS/tag_hn.asp

<h1>>Thelonious Monk</h1><h2>"All musicians are subconsciously mathematicians."</h2>

H1H2

http://www.w3schools.com/TAGS/tag_hn.asp

imgImage (daaa)

<img src="http://farm5.static.

flickr.com/4144/4843138893_

c6b201769b.jpg"/>

http://www.w3schools.com/TAGS/tag_img.asp

imgImage (daaa)

<img src="http://farm5.static.

flickr.com/4144/4843138893_

c6b201769b.jpg"

alt="Monk Playing”

height="100”

width="100” />

http://www.w3schools.com/TAGS/tag_img.asp

PParagraph

http://www.w3schools.com/TAGS/tag_p.asp

<p>

Thelonious Monk was born October 10, 1917 in Rocky Mount,

North Carolina, the son of Thelonious and Barbara Monk, two

years after his sister Marion. A brother, Thomas, was born in

January 1920.[8] In 1922, the family moved to 243 West 63rd

Street, in Manhattan, New York City. Monk started playing the

piano at the age of six. Although he had some formal training and

eavesdropped on his sister's piano lessons, he was largely self-

taught. Monk attended Stuyvesant High School, but did not gradu-

ate. He toured with an evangelist in his teens, playing the church

organ, and in his late teens he began to find work playing

jazz.<br>

<a href="http://en.wikipedia.org/wiki/Thelonious_Monk"

target="_blank">Wikipedia value</a>

</p>

aanchor

<a href="http://en.wikipedia.org/

wiki/Thelonious_Monk"

target="_blank">

Wikipedia value</a>

http://www.w3schools.com/TAGS/tag_a.asp

ol / l iordered list / list item

<ol>

<li>Volume 1</li>

<li>Volume 2</li>

<li>Thelonious Monk Trio</li>

<li>Monk (Prestige 7053)</li>

<li>Thelonious Monk and

Sonny Rollins</li>

</ol>

http://www.w3schools.com/TAGS/tag_ol.asp

ul / l iUNordered list / list item

<ul>

<li>The Unique Monk</li>

<li>Brilliant Corners</li>

<li>Thelonious Himself</li>

<li>Monk's Music</li>

</ul>

http://www.w3schools.com/TAGS/tag_ul.asp

?#!<iframe width="420" height="315"

src="http://www.youtube.com/

embed/OMmeNsmQaFw"

frameborder="0" allowfullscreen>

</iframe>

http://www.w3schools.com/TAGS/tag_ul.asp

http://www.w3schools.com/tags/tag_div.asp

<div>and<span>

http://www.w3schools.com/tags/tag_table.asp

Table / th / t r / tdTable / table header / table row / table data

<html><head> <title>Thelonious Monk</title></head>

<body> <div> <h1>>Thelonious Monk</h1> <h2>"All musicians are subconsciously mathematicians."</h2>

<img src="http://farm5.static.flickr.com/4144/4843138893_c6b201769b.jpg"> </div>

<div> <p> Thelonious Monk was born October 10, 1917 in Rocky Mount, North Carolina, the son of Thelonious and Barbara Monk, two years after his sister Marion. A brother, Thomas, was born in January 1920.[8] In 1922, the family moved to 243 West 63rd Street, in Manhattan, New York City. Monk started playing the piano at the age of six. Although he had some formal training and eavesdropped on his sister's piano lessons, he was largely self-taught. Monk attended Stuyvesant High School, but did not graduate. He toured with an evangelist in his teens, playing the church organ, and in his late teens he began to find work playing jazz.<br> <a href="http://en.wikipedia.org/wiki/Thelonious_Monk" target="_blank">Wikipedia value</a> </p> <h2>Discography</h2> <h3>Blue Note Records (1948-1952)</h3> <ol> <li>Genius of Modern Music: Volume 1</li> <li>Genius of Modern Music: Volume 2</li> <li>Thelonious Monk Trio</li> <li>>Monk (Prestige 7053)</li> <li>Thelonious Monk and Sonny Rollins (Prestige 7075)</li> </ol> </div>

<div> <h3>Misc Records</h3> <ul> <li>Thelonious Monk plays the Music of Duke Ellington (1955)</li> <li>The Unique Thelonious Monk (1955)</li> <li>Brilliant Corners (1956 recording with Sonny Rollins and Clark Terry)</li> <li>Thelonious Himself (1957)</li> <li>Tonk's Music (1957)</li> </ul>

<h2>Videos</h2> <iframe width="420" height="315" src="http://www.youtube.com/embed/OMmeNsmQaFw" frameborder="0" allowfullscreen></iframe> </div>

</body></html>

<html><head> <title>Thelonious Monk</title></head>

<body> <div style="color:blue;text-align:right"> <h1>>Thelonious Monk</h1> <h2>"All musicians are subconsciously mathematicians."</h2>

<img src="http://farm5.static.flickr.com/4144/4843138893_c6b201769b.jpg"> </div>

<div style="color:red;text-align:center"> <p> Thelonious Monk was born October 10, 1917 in Rocky Mount, North Carolina, the son of Thelonious and Barbara Monk, two years after his sister Marion. A brother, Thomas, was born in January 1920.[8] In 1922, the family moved to 243 West 63rd Street, in Manhattan, New York City. Monk started playing the piano at the age of six. Although he had some formal training and eavesdropped on his sister's piano lessons, he was largely self-taught. Monk attended Stuyvesant High School, but did not graduate. He toured with an evangelist in his teens, playing the church organ, and in his late teens he began to find work playing jazz.<br> <a href="http://en.wikipedia.org/wiki/Thelonious_Monk" target="_blank">Wikipedia value</a> </p> <h2>Discography</h2> <h3>Blue Note Records (1948-1952)</h3> <ol> <li>Genius of Modern Music: Volume 1</li> <li>Genius of Modern Music: Volume 2</li> <li>Thelonious Monk Trio</li> <li>>Monk (Prestige 7053)</li> <li>Thelonious Monk and Sonny Rollins (Prestige 7075)</li> </ol> </div>

<div style="color:green;text-align:left"> <h3>Misc Records</h3> <ul> <li>Thelonious Monk plays the Music of Duke Ellington (1955)</li> <li>The Unique Thelonious Monk (1955)</li> <li>Brilliant Corners (1956 recording with Sonny Rollins and Clark Terry)</li> <li>Thelonious Himself (1957)</li> <li>Tonk's Music (1957)</li> </ul>

<h2>Videos</h2> <iframe width="420" height="315" src="http://www.youtube.com/embed/OMmeNsmQaFw" frameborder="0" allowfullscreen></iframe> </div>

</body></html>

THAT’SALLFOLKSwww.slideshare.net/idanska

homework

css for designers - lesson 1 - html

Technology