CSS – 01 Styles


CSS styles are at the heart of website design. They enable us to create stunning layouts that look great across all browsers and devices.

CSS styles allow us to control the layout, colors, fonts, and other visual elements of a website. With CSS, we can make sure that our websites look great no matter what device or browser they are viewed on.

CSS styles are essential for creating a visually appealing website that is easy to navigate and use. It enables developers to quickly create beautiful webpages with minimal effort. As such, it is important for any web developer or designer to have a good understanding of how CSS works and how to use it effectively.

Placeholder for new CSS transfer

Click Button to Load Custom Stylesheet

What better way to showcase the fundamental elements of CSS than starting with the most basic tags styled with CSS.

CSS Styles (header 1)

Are you confused about the right way to format content using header 1-6 styles? (header 2)

Don’t worry, we’ve got you covered! In this article, we will show you how to properly use headers and css styles to make your content look professional and organized. We will also provide some tips on how to create a consistent style guide for all your content. So, let’s get started!

Header 03

Header 04

Header 05
Header 06

Paragraph Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate. Velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt. Mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit. Esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit. Anim id est laborum.


List Types

Ordered List

  1. Item one.
  2. Item two.

Unordered List

  • Item one.
  • Item two.

Custom List

  • Unordered list item
  • Cake ice cream sweet sesame snaps dragée cupcake wafer cookie
  • Unordered list item

Definition List

Definition List Title
This is a definition list division.
This is a second definition list item.

Tables

Responsive Table Layout
Person Due Date Amount Period
Billie 04/01/2016 $1,190 03/01/2016 – 03/31/2016
Jill 03/01/2016 $2,443 02/01/2016 – 02/29/2016
Jamie 03/01/2016 $1,181 02/01/2016 – 02/29/2016
Robin 02/01/2016 $842 01/01/2016 – 01/31/2016

Misc. Formatting Sub, Sup, Pre, Acronym, Abbr, and Code

Subscript

Subscript is the word, letter, object, or symbol positioned below the line.

Superscript

Superscript is the word, letter, figure, or symbol positioned above the line.

Cite

How to Cite Content

Pre.

Preformatted Text is presented exactly as written in the HTML file. To preserve typographical formatting that affects the meaning of the content. Such as in poems, or lines of code, ASCII art, and transcripts. 

Acronym Tag

Acronym have a title tag added to the Acronym – in this case the title is National Basketball Association. NBA

Abbreviation Tag

A hidden Title Tag for the Abbreviation

Lenion AVE.


Blockquote

“Blockquotes are used to quote content from another source – can often be enclosed with quote marks”

– My name is prince


Code

The code tag provides a method to display code content with fixed letter size, font, and spacing.

Forms

The Form Tag is used for creating forms from the user. With a range of different form elements.

Form Element – Text Box Input

Capture short text answers.

Form Element – Password Input






Form Element – Text Area Input

The textarea element lets your users answer in their own words (with limits).

Form Element – Select Drop Down

Form Element – Check Box

How I Like to Travel





Form Element – Radio Input

The radio button allows the user to select only one anwser of many answers.

Choose your favorite Web language:

   
   
   

Form Element – File Input

Have the user upload a file.


Form Element – Submit Button

A form is nothing without a submit button.



Leave a Reply

Your email address will not be published. Required fields are marked *