diff --git a/base.css b/base.css new file mode 100644 index 0000000..ba4cb26 --- /dev/null +++ b/base.css @@ -0,0 +1,92 @@ +/* color-scheme: auto convert html components to light or dark */ +html { + color-scheme: dark light; + -webkit-tap-highlight-color: transparent +} + + + +*, +*::before, +*::after { + box-sizing: border-box; +} + +* { + margin: 0; +} + + + +body { + line-height: 1.5; + /* Improve Accessibility */ + -webkit-font-smoothing: antialiased; + /* Improve text rendering in safari */ +} + + + +img, +picture, +video, +canvas, +svg { + display: block; + max-width: 100%; +} + +iframe { + display: block; + border: none; + max-width: 100%; +} + + + +input, +button, +textarea, +select { + /* Removes auto zooming in safari */ + font-size: inherit; +} + + + +p { + /* "lang" html attribute recommended to use hyphens css property*/ + hyphens: auto; +} + +p, +h1, +h2, +h3, +h4, +h5, +h6 { + overflow-wrap: break-word; +} + +a { + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} + + + +input, +textarea, +label { + display: block; +} + +menu, +ul, +ol { + padding: 0; +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..3ca4a5c --- /dev/null +++ b/index.html @@ -0,0 +1,247 @@ + + + + + + + HTML Elements Test + + + + + + +
+

Added few styling to improve the visibility (only in this page)

+ +
+ +
+

Header with a Nav and link List

+ +
+ + + +
+ +
+

Heading 1 (h1)

+

Heading 2 (h2)

+

Heading 3 (h3)

+

Heading 4 (h4)

+
Heading 5 (h5)
+
Heading 6 (h6)
+
+ +
+

Texts

+

This is a Paragraph. +
+ This is a Strong (strong) text. (Good for SEO) +
+ This is a Bold (b) text. +
+ This is a Emphasize (em) text. (Good for SEO) +
+ This is an Italics (i) text. +
+ this is a mark text. +
+ this is a sub text. +
+ this is a sup text. +

This is a blockquote.
+ 
This is preformatted text.
+ +

This is inline code.

+ +

This is an abbr.

+ +
+
Definition Term
+
Definition description goes here.
+
+
This is an address element. (never heard of it)
+
+ +
+

Lists

+ +
    +
  1. Ordered list item
    2. +
  2. Another ordered list item
    3. +
+ +
  • menu: Unordered list item
    • +
  • menu: Another unordered list item
    • +     +
    + Details element with summary (toggle it) + This is some hidden content inside the details element. +
    +
    + +
    +

    Tables

    + + + + + + + + + + + + + + + + + +
    Header 1Header 2
    Row 1, Col 1Row 1, Col 2
    Row 2, Col 1Row 2, Col 2
    +
    + +
    +

    Forms

    +
    + + + + + + + + + + + + + + + + + + + +
    +
    + +
    +

    Media & iframe

    +
    + [korigengi] Megumin Konosuba from deviantart +
    This is a figure with an image and a figcaption.
    +
    + + + + + +
    + +
    +
    + article +
    + + +
    + +
    + This is an open dialog window +
    + + +
    + + + + + + \ No newline at end of file diff --git a/megumin_loves_explosion b/megumin_loves_explosion new file mode 100644 index 0000000..eb2f581 Binary files /dev/null and b/megumin_loves_explosion differ