diff --git a/Version1.0/webDevUser14.html b/Version1.0/webDevUser14.html index 86bf8b5f7..735e76a93 100644 --- a/Version1.0/webDevUser14.html +++ b/Version1.0/webDevUser14.html @@ -1,8 +1,8 @@ @@ -12,7 +12,7 @@ -
My name is User #14
+
My name is Jonathan
diff --git a/Version2.0/webDevUser14.html b/Version2.0/webDevUser14.html index aae18d9b0..75af8c4d1 100644 --- a/Version2.0/webDevUser14.html +++ b/Version2.0/webDevUser14.html @@ -7,7 +7,7 @@ - User ## Version 2.0 + Jonathan's Version 2.0 @@ -19,8 +19,67 @@ + @@ -37,19 +96,54 @@

About Me

Heading Examples

- +

this is heading 1

+

this is heading 2

+

this is heading 3

+

this is heading 4

+
this is heading 5
+
this is heading 6

Examples of "Other" HTML elements

- + - puts a strike through the words + - adds underline + -- subscript + -- superscript + -- defines a small text + - represents the progress of a task +
— will place a horizontal line (no closing tag needed) + WHO -- used to show acronyms +
+

PUT YOUR BIG TITLE HERE

+
+

Introduction or 1st Point

+

Lorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs. The passage is attributed to an unknown typesetter in the 15th century who is thought to have scrambled parts of Cicero's De Finibus Bonorum et Malorum for use in a type specimen book. It usually begins with:

+
+ +
+

2nd Point

+

Content in here that explains your 2nd point

+
+ +
- +
+
+
+
+
+
+
+
+
+
diff --git a/Version3.0/user14/CSS/aboutme.html b/Version3.0/user14/CSS/aboutme.html new file mode 100644 index 000000000..81fc3941b --- /dev/null +++ b/Version3.0/user14/CSS/aboutme.html @@ -0,0 +1,162 @@ ++ + + + + + + Web Dev User ## + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +

About Me

+ + +

Headings Are Block Elements

+ +

paragraphs are blocks, too.However, <em> and <strong> + elements are not. They are inline elements.

+ +

Block elements define the flow of the HTML document, while inline elements + do not.

+ +
+ + + + + + + \ No newline at end of file diff --git a/Version3.0/user14/CSS/style.css b/Version3.0/user14/CSS/style.css index 9b90a3f28..ba5ecd3c3 100644 --- a/Version3.0/user14/CSS/style.css +++ b/Version3.0/user14/CSS/style.css @@ -1,21 +1,17 @@ -table { - font-family: "Marker Felt", "Comic Sans MS", fantasy; - color: #003366; - margin-left: auto; - margin-right: auto; - text-align: left; - border-collapse: collapse; - cellspacing: 0px; +table{ +margin-right: auto; +text-align: left; +border-collapse: collapse; +border-spacing: 0px; +border-spacing: 0px; } tr { - border: 1px solid #ffffff; - text-align: center; - background-color:#9FB6CD; +color: #ffffff; +background-color: blueviolet; } -th { - text-align: center; - color: #ffffff; - background-color: #003366; +body{ +background-image: url("../images/NFL-Team-Logos.jpeg"); +background-color: rgb(126, 110, 56); } \ No newline at end of file diff --git a/Version3.0/user14/images/Kendrick-Lamar-Good-Kid-Maad-City1-1024x1024.jpeg b/Version3.0/user14/images/Kendrick-Lamar-Good-Kid-Maad-City1-1024x1024.jpeg new file mode 100644 index 000000000..3761c7368 Binary files /dev/null and b/Version3.0/user14/images/Kendrick-Lamar-Good-Kid-Maad-City1-1024x1024.jpeg differ diff --git a/Version3.0/user14/images/TCD.jpg b/Version3.0/user14/images/TCD.jpg new file mode 100644 index 000000000..05f131fea Binary files /dev/null and b/Version3.0/user14/images/TCD.jpg differ diff --git a/Version3.0/user14/images/blonde.jpeg b/Version3.0/user14/images/blonde.jpeg new file mode 100644 index 000000000..ba9255ed3 Binary files /dev/null and b/Version3.0/user14/images/blonde.jpeg differ diff --git a/Version3.0/user14/images/blonded.jpeg b/Version3.0/user14/images/blonded.jpeg new file mode 100644 index 000000000..11c560774 Binary files /dev/null and b/Version3.0/user14/images/blonded.jpeg differ diff --git a/Version3.0/user14/images/gkkmc.jpg b/Version3.0/user14/images/gkkmc.jpg new file mode 100644 index 000000000..21ac47a78 Binary files /dev/null and b/Version3.0/user14/images/gkkmc.jpg differ diff --git a/Version3.0/user14/images/gkmc.jpg b/Version3.0/user14/images/gkmc.jpg new file mode 100644 index 000000000..2f6845125 Binary files /dev/null and b/Version3.0/user14/images/gkmc.jpg differ diff --git a/Version3.0/user14/images/graduation.jpeg b/Version3.0/user14/images/graduation.jpeg new file mode 100644 index 000000000..50b4bc033 Binary files /dev/null and b/Version3.0/user14/images/graduation.jpeg differ diff --git a/Version3.0/user14/images/graduuation.jpeg b/Version3.0/user14/images/graduuation.jpeg new file mode 100644 index 000000000..e920cc34d Binary files /dev/null and b/Version3.0/user14/images/graduuation.jpeg differ diff --git a/Version3.0/user14/images/topab.jpeg b/Version3.0/user14/images/topab.jpeg new file mode 100644 index 000000000..62e92282c Binary files /dev/null and b/Version3.0/user14/images/topab.jpeg differ diff --git a/Version3.0/user14/images/tpab.jpeg b/Version3.0/user14/images/tpab.jpeg new file mode 100644 index 000000000..4d6463386 Binary files /dev/null and b/Version3.0/user14/images/tpab.jpeg differ diff --git a/Version3.0/user14/music.html b/Version3.0/user14/music.html new file mode 100644 index 000000000..46586e726 --- /dev/null +++ b/Version3.0/user14/music.html @@ -0,0 +1,135 @@ + + + + + + + Music for Web Dev User ## + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +

Music

+ + +

My Top 5 Favorite Albums

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
RankArtistAlbumAlbum Art
1Kendrick Lamargood kid, m.A.A.d. cityblack minivan in front of houses
2Kanye WestThe College Dropoutman in bear costume sitting on bench
3Kanye WestGraduationbear launching from spaceship
4Kendrick LamarTo Pimp A Butterflybunch of people side to side against each other
5Frank OceanBlondeman crying with hand on his face
+
+ + + + + + + + + \ No newline at end of file diff --git a/Version4.0/user14/CSS/gallery.css b/Version4.0/user14/CSS/gallery.css new file mode 100644 index 000000000..3bf141b38 --- /dev/null +++ b/Version4.0/user14/CSS/gallery.css @@ -0,0 +1,70 @@ +@import url('https://fonts.googleapis.com/css2?family=Texturina:wght@100&display=swap'); +#gallery { + font-family: "Orbitron", sans-serif; + line-height: 1.5em; + text-align: center; + } + + .container { + display: inline-block; + margin: 3%; + perspective: 1000px; +} + +.flipper { + position: relative; + transition: 0.6s; + transform-style: preserve-3d; +} + +.front{ + z-index:2; +} + +.back{ + transform:rotateY(0deg);} + + img { + width: 100%; + } + + .front{ + z-index:2; + } + + .front, .back { + position: absolute; + top: 0; + left: 60; + width: 250px; + height: 320px; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); + backface-visibility: hidden; + } + + .back{ + transform:rotateY(180deg); + } + + .container, .front, .back { + width: 250px; + height: 320px; + } + + .container:hover .flipper { + transform: rotateY(180deg); + } + + a { + color: black; + } + + .caption, .back h1 { + font-family: "Orbitron", sans-serif; + font-size: 1.7em; + padding: 10px 10px 0 10px; + margin: 0; + text-align: center; + } + + \ No newline at end of file diff --git a/Version4.0/user14/CSS/style.css b/Version4.0/user14/CSS/style.css index 9b90a3f28..ec30a3a72 100644 --- a/Version4.0/user14/CSS/style.css +++ b/Version4.0/user14/CSS/style.css @@ -1,21 +1,143 @@ -table { - font-family: "Marker Felt", "Comic Sans MS", fantasy; - color: #003366; +.button { + background-color: #4CAF50; + border: none; + color: white; + padding: 40px; + text-align: left; + text-decoration: none; + display: inline-block; + font-size: 23px; + margin: 10Px 7px; + cursor: pointer; +} + +.button1 { + border-radius: 8px; +} + +.button2 { + border-radius: 30%; +} + +.red { + background-color: #ff0000; +} + +td{ + padding:20px; +} + +table{ margin-left: auto; margin-right: auto; - text-align: left; - border-collapse: collapse; - cellspacing: 0px; } -tr { - border: 1px solid #ffffff; - text-align: center; - background-color:#9FB6CD; +h1, h2, h3, h4, h5, h6{ + text-align:center; +} +.buttonLARGE{ + font-size: medium; + font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; +} +.buttonSMALL{ + font-size: medium; + font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; +} +.button3{ + font-size: medium; + font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; +} +.title{ + color: red; + font-family: 'Trebuchet MS', sans-serif; + } + + .title-large { + font-size: 2rem; + } + + .title-small { + font-size: .5rem; + } + *{ + text-align:right; + border: 2px solid black; } +#knowledge > * { + border: 3px red solid; + } + p + * { + background-color: #FFFF00; + } + div li::marker{ + color: red; + } + div li::marker{ + content:"😜 "; + } -th { - text-align: center; - color: #ffffff; - background-color: #003366; -} \ No newline at end of file + + + @import url(rainbow.css); + .background-red { + background-color: red; +} + +.background-orange { + background-color: orange; +} + +.background-yellow { + background-color: yellow; +} + +.background-green { + background-color: green; +} + +.background-blue { + background-color: blue; +} + +.background-indigo { + background-color: indigo; +} + +.background-violet { + background-color: violet; +} + +td:hover { + background-color: black; + } + /* unvisited link */ +a:link { + color: red; + } + + /* visited link */ + a:visited { + color: orange; + } + + /* mouse over link */ + a:hover { + color: hotpink; + } + + /* selected link */ + a:active { + color: blue; + } + p { + display: visible; + background-color: yellow; + padding: 20px; + } + + div:hover p { + display: block; + } + p:first-child { + color: green; + } \ No newline at end of file diff --git a/Version4.0/user14/display.html b/Version4.0/user14/display.html new file mode 100644 index 000000000..4f5fe4941 --- /dev/null +++ b/Version4.0/user14/display.html @@ -0,0 +1,169 @@ + + + + + + + Web Development Candidates + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +

Hiring Page

+ + + +
+

We at HireMe.com have one true belief. We believe in people. Since 1964, we have connected the best + people, + their talents, skills, career goals, and aspirations with the best companies. We are +

"Career Gurus."

We are "People-People." Let us introduce + you! +

+
+ +

People

+ +
+ Avatar John +
+

John Doe

+

Architect & Engineer

+
+
+
+ Avatar Jane +
+

Jane Doe

+

Computer Scientist

+
+
+
+ Avatar Linux +
+

Sir Linux Penguin

+

Senior Computer Network Architect

+
+
+ +
+ + + + + + + \ No newline at end of file diff --git a/Version4.0/user14/gallery.html b/Version4.0/user14/gallery.html new file mode 100644 index 000000000..da00bbcbd --- /dev/null +++ b/Version4.0/user14/gallery.html @@ -0,0 +1,176 @@ + + + + + + + Gallery + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +

Check out my favorite images

+ + + + + + +
+
+
+ rectangular box with blue sticker on it +

Computer Part

+
+
+ +

SSD

+ +

A solid-state drive (SSD) is a solid-state storage device that uses integrated circuit assemblies to store data persistently, typically using flash memory, and functioning as secondary storage in the hierarchy of computer storage.

+
+
+
+ + + +
+ + + + + + + diff --git a/Version4.0/user14/index.html b/Version4.0/user14/index.html index 64cc9eb32..7d3ce27c4 100644 --- a/Version4.0/user14/index.html +++ b/Version4.0/user14/index.html @@ -1,18 +1,169 @@ + - - - - Web Development User #14 - - - - - -
My name is User #14
- - + + + + Hire Me For Your Web Development Needs + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +

Check out my work!

+ + + +

I'm a Web Developer

+ + + + + + + + + + + + + + + + +
+ + + + + + + +
+ + + + + + + + + + +
+
+ + + Example of a Heading Title + +
+ +

+ Page content.. +

+ +

+ Some more page content.. +

+ +
+ +

+ Even more content +

+ + +
+ + + + + + + +
+ \ No newline at end of file diff --git a/Version4.0/user14/portfolio.html b/Version4.0/user14/portfolio.html new file mode 100644 index 000000000..2c2d74809 --- /dev/null +++ b/Version4.0/user14/portfolio.html @@ -0,0 +1,167 @@ + + + + + + + My Work as a Web Developer + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +

Check out my work!

+ + + +

I'm a Web Developer

+
+
  • CSS +
      +
    • Classes
      • +
    • Selectors
      • +
    • ID's
      • +
    +
    • +
  • HTML +
      +
    • Tables
      • +
    • DIV's
      • +
    • Nav Bar
      • +
    +
    • +
    +

    + These are the things I know in the WEB DEVELOPMENT world. +

    +

    + I will use my knowledge to create an amazing website for you and your needs. +

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

    Styling a link depending on state

    + +

    This is a link

    +

    Note: a:hover MUST come after a:link and a:visited in the CSS definition in order to be effective.

    +

    Note: a:active MUST come after a:hover in the CSS definition in order to be effective.

    + + +
    Hover over this div element to show the p element +

    Tada! Here I am!

    +
    + +

    This is some text.

    +

    This is some text.

    + +
    +

    This is some text.

    +

    This is some text.

    +
    + + + + + + + + \ No newline at end of file