Styling

font-family

Set the font of the paragraph to "courier".
style=" font-family :courier;"

---

color

Set the color of the paragraph to "blue".
style=" color :blue;"

---

text-align

Center align the paragraph.
style=" text-align :center;"

---

font-size

Set the text size to 50 pixels.
style=" font-size :50PX;"

---

background-color

Set the background-color of the document to yellow.
style=" background-color :yellow;"

---

Formatting

strong (importance)

Add extra importance to the word Tarsus in the paragraph .

---

em (emphasize)

Emphasize the word " metropolitan" in the text below.

---

b (attention)

Attention word " FUN " in the text below.

---

del(strikeout)

Add a line through (strikeout) the letters " blue " in the text

---

sub (subscript)

Apply subscript formatting to the number " H₂O" in the text below.

---

Links

text-decoration:none;

Use CSS to remove the underline from the link .

---

target="_blank"

Use the correct HTML attribute to make the link open in a new window.

---

href img src ="link"

Use the correct HTML to make the image become a link.

---

Images

alt="AlternateName"

Specify an alternate text for the image.
The alternate text should say "AlternateName".
Alternate text is useful when the image cannot be displayed, like when the page is read by a screen reader.

---

Tables

Row with two headers

Add a table row with two table headers.
The two table headers should have the value "Name" and "Age".

Name	Age
Eray Erdoğan	22

---

caption

Add a table caption that says " Names and Points".

Names and Points

First Name	Last Name	Points
Jill	Smith	50

---

Using Colspan

Use the correct HTML attribute to make the first TH element span two columns.(Under the Name head we used two td with span)

Name		Age
Jill	Smith	50
Eve	Jackson	94

Summary

1. Use the HTML < table> element to define a table
2. Use the HTML < tr> element to define a table row
3. Use the HTML < td> element to define a table data
4. Use the HTML < th> element to define a table heading
5. Use the HTML < caption> element to define a table caption
6. Use the CSS border property to define a border
7. Use the CSS border-collapse property to collapse cell borders
8. Use the CSS padding property to add padding to cells
9. Use the CSS text-align property to align cell text
10. Use the CSS border-spacing property to set the spacing between cells
11. Use the colspan attribute to make a cell span many columns
12. Use the rowspan attribute to make a cell span many rows
13. Use the id attribute to uniquely define one table

---

Lists

< ul >

Add a list item with the text "Coffee" inside the < ul >.

• Coffee

---

< ol >

Finish the HTML code to make an ordered list.

1. Coffee
2. Tea
3. Milk

---

style="list-style-type:square;"

Use CSS to display squares instead of bullets.

• Coffee
• Tea
• Milk

---

type="A"

Use the correct HTML attribute to display letters (uppercase ABC) instead of numbers.

1. Coffee
2. Tea
3. Milk

type="i"

Use the correct HTML attribute to display i instead of numbers.

1. Coffee
2. Tea
3. Milk

---

Description list (< dl >)

Coffee

- black hot drink

Milk

- white cold drink

---

Forms

input type="button" value="OK"

In the form below, add an input field with the type "button" and the value "OK".

---

input type="radio" name="fav_language" (Radio button)

In the form below, add two radio buttons, both with the name "fav_language".

HTML CSS

---

HTML form attributes (action="/action_page.php")

Add a submit button, and specify that the form should go to "/action_page.php".

Name:

---

HTML form elements (< select name="cars"> < option value="">< /option> < /select>)

In the form below, add an empty drop down list with the name "cars".
The first option must have the value "Volvo"
The second option must have the value "Ford".

Volvo Ford

---

HTML form elements (checkbox) (< input type="checkbox")

Highschool Graduate
Bachelor Degree
Master's Degree

---

HTML form elements (date)(< input type="date" min="1990-01-01")

Enter a date after 1989:

---

HTML form elements (e-mail)(< input type="email" placeholder="")

Enter your email:

---

Block-Inline

Here are the inline elements in HTML:

"a" "abbr" "b" "bdo" "br" "button""cite"
code dfn em"i""img""input""kbd"
label map object output q samp
script select small span strong
sub sup textarea time var

---

Here are the block-level elements in HTML:

address article aside blockquote canvas
dd div dl dt fieldset figcaption
figure footer form h1- h6 header
hr li main nav noscript ol p
pre section table tfoot ul video>

---

Here are some examples with div and span

div

London

London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.

---

span

My mother has blue eyes and my father has dark green eyes.