logo

HTML and CSS web page

Photo by Ahmed Abbas on Unsplash

Block and inline elements

This is plain text in a block element.

This is a block element with a bold inline element.



Attributes

The id attribute allows us to uniquely identify an element/tag, and allows us to select that element in CSS or Javascript.

The id attribute allows us to uniquely identify an element/tag, and allows us to select that element in CSS or Javascript.

The class attribute allows us to identify more than one tag/element to apply a change with CSS or Javascript.

The class attribute allows us to identify more than one tag/element to apply a change with CSS or Javascript.



Links

This is the George Brown Website.

One of the better HTML info sites is W3 schools

This is my template file using a document relative path.

This is my template file using a root relative path.

This is my index.html file using a root relative path.

This is my index.html file using a document relative path.



Lists

Unordered list

  • Apple
  • Orange
  • Banana
  • Water
    1. Apple
    2. Orange
    3. Banana
    4. Water

Ordered list

  1. Apple
  2. Orange
  3. Banana
  4. Water
  5. My gblearn

Lorem Ipsum

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem deserunt doloremque esse est iure iusto labore laborum minima molestiae, necessitatibus officia repellat totam veritatis voluptates.

Cum cupiditate, deserunt earum eius labore laborum, laudantium necessitatibus, numquam praesentium repellendus reprehenderit sint. Aspernatur delectus enim ipsum iusto molestiae officiis quibusdam quo sed, tempora?

Adipisci dolor dolores illo, laboriosam non quisquam. Dolor dolorem error eveniet ipsam ipsum, magnam minus nostrum nulla omnis repudiandae sequi tempore tenetur vel voluptas voluptatem.

Cum, exercitationem, provident! Consequuntur cumque dolor doloribus facere hic incidunt itaque laborum officia quaerat quidem quisquam quo saepe sapiente sit suscipit vel, voluptas. Nisi, praesentium.

Asperiores, consectetur culpa deleniti distinctio enim et fugit in ipsum iste laboriosam minus nam nihil numquam provident quas quidem quo, similique sint suscipit tempora voluptatum.



Images

cat winking cat winking
folder structure
Fig. 1 folder structure


Regular Tables

My Table
Date Name Cost
Jan. Costpro $100
data1 data2 data3
data1 data2 data3
data1 data2 data3
data1 data2
Total: $100

Nested Table

Nested table 1
r1 c1 r1 c2
r2 c1 r2 c2
Nested table 2
r1 c1 r1 c2 r1 c3
r2 c1 r2 c2 r2 c3
table#stable>(thead>tr>th{title$}*6)+(tbody>(tr>td{data$}*6)*5)+(tfoot>tr>th{foot$}*6)
title1 title2 title3 title4 title5 title6
data1 data2 data3 data4 data5 data6
data1 data2 data3 data4 data5 data6
data1 data2 data3 data4 data5 data6
data1 data2 data3 data4 data5 data6
data1 data2 data3 data4 data5 data6
foot1 foot2 foot3 foot4 foot5 foot6

Froms Section