From 6010bf2afca8bdffa6db5993b563578dda191f67 Mon Sep 17 00:00:00 2001 From: WeifengZhao1 Date: Fri, 17 Sep 2021 12:30:02 -0400 Subject: [PATCH] First CTP Homework --- css/styles.css | 83 +++++++++++++++++++++++++++++++++++++++ index.html | 104 +++++++++++++++++++++++++++++++++++-------------- 2 files changed, 158 insertions(+), 29 deletions(-) diff --git a/css/styles.css b/css/styles.css index 8b13789..84c1573 100644 --- a/css/styles.css +++ b/css/styles.css @@ -1 +1,84 @@ +.milkbg-container{ + position: relative; + text-align: center; + color: white; + font-weight: bolder; +} +.milk-text { + position: absolute; + top: 50%; + left: 50%; + height: 300px; + width: 600px; + transform: translate(-50%, -50%); + border: 1px solid black; + /* background-color: transparent; + opacity: 0.8; */ + background-color: rgba(0,0,0, 0.6); + border-radius: 5px; + font-size:22px; + + } + +.cookie-pic { + border-radius: 50%; + justify-content: space-between; + width: 100%; +} + +.cookie-store-name{ + font-size:75px; +} + +.about-us { + background-color: lightgray; + font-size:30px; + display: inline-block; + text-align: center; +} + +.contact-us { + font-family: 'Open Sans', sans-serif;; + font-weight: bold; + text-align: center; + background-color: rgb(89, 186, 247); + color:white; + margin-bottom: auto; + height: 175px; + +} + +.img-fluid{ + width: 100%; +} + +.cookie-store{ + text-align: center; + margin:80px; +} + +.the-cookies{ + text-align: center; + margin: 5px; +} + + +.about-us-par{ + text-align: left; + font-weight: light; + color: rgb(87, 85, 85); + font-size: 20px; + font-family: 'Open Sans', sans-serif; +} + +.contct-us-title{ + padding: 10px; + height: 50px; + font-family: 'Open Sans', sans-serif; + font-size: 30px; +} + +.address { + font-size:large; +} \ No newline at end of file diff --git a/index.html b/index.html index e2bedec..8c71b08 100644 --- a/index.html +++ b/index.html @@ -1,47 +1,93 @@ + Cookie Store + + + +
+ Responsive image +
+
+

+
Cookie Store
+

+

Buy our awesome cookies. All proceeds go to charity!

+
+
+
+ +
+

The Cookies

+
-

Cookie Store

+
+
-

Buy our awesome cookies. All proceeds go to charity!

+
+

Thin Mint Cookies

+

Tasty mint chocolate cookies

+ +
-

The Cookies

+
+

Peanut Butter Cookies

+

Yummy peanut buttery goodness!

+ +
-

Thin Mint Cookies

-

Tasty mint chocolate cookies

- +
+

Short Bread Cookies

+

Santa's favorite classic.

+ +
-

Peanut Butter Cookies

-

Yummy peanut buttery goodness!

- +
+

Smore's Cookies

+

Camp fire favorite!

+ +
+
+
-

Short Bread Cookies

-

Santa's favorite classic.

- -

Smore's Cookies

-

Camp fire favorite!

- +
+
+

About us

+
-

About us

-
Lorem ipsum dolor sit amet, consectetur adipisicing 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.
+
+ +
-

Contact us

-
- 100 Broadway Avenue,
- New York, NY 10001
- (212) 555-1234 -
+
+
Lorem ipsum dolor sit amet, consectetur adipisicing 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. +
+
+
+ +
+

+
Contact us
+

+ +
+ 100 Broadway Avenue,
+ New York, NY 10001
+ (212) 555-1234 +
+
- + + \ No newline at end of file