Make a birthday invitation that looks like the picture attached below. Use the Bootstrap template. Use your own photo. Use Bootstrap classes to make it circular (or oval or whatever BS does). Use only built-in Bootstrap classes; don't make your own. GIVE ALL CODES. i will upload it in my server. thank you i will upvote!!

Database System Concepts
7th Edition
ISBN:9780078022159
Author:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Chapter1: Introduction
Section: Chapter Questions
Problem 1PE
icon
Related questions
Question
100%

Make a birthday invitation that looks like the picture attached below.

Use the Bootstrap template. Use your own photo. Use Bootstrap classes to make it circular (or oval or whatever BS does). Use only built-in Bootstrap classes; don't make your own.

GIVE ALL CODES. i will upload it in my server. thank you i will upvote!!

 

**Birthday Party Invitation**

You're invited!

- **Where:** The backyard
- **When:** Tomorrow

*Please don't tell the cats!*

*Image Description:* The invitation features a photo of a happy, fluffy dog with its mouth open, as if it is smiling, set against a blurred background of grass. The image is oval-shaped and adds a cheerful touch to the invitation.
Transcribed Image Text:**Birthday Party Invitation** You're invited! - **Where:** The backyard - **When:** Tomorrow *Please don't tell the cats!* *Image Description:* The invitation features a photo of a happy, fluffy dog with its mouth open, as if it is smiling, set against a blurred background of grass. The image is oval-shaped and adds a cheerful touch to the invitation.
Expert Solution
Step 1: Algorithm:

Algorithm: Birthday Invitation Creation

Input: 
- Name of the birthday person (String)
- Date of the birthday party (String)
- Time of the birthday party (String)
- Location of the birthday party (String)
- URL of the birthday person's photo (String)
- RSVP link (String)

Output: 
- HTML birthday invitation

1. Start by creating an HTML document.

2. Add the necessary HTML structure:
   - HTML declaration.
   - Head section with character set and viewport meta tag.
   - Link to the Bootstrap CSS stylesheet.
   - Title for the document.

3. Inside the body of the HTML document:
   a. Create a container div with a top margin for spacing.
   b. Inside the container, create a row and center it on the page using Bootstrap classes.

4. Within the row:
   a. Create a column of size 6 and center it using the Bootstrap offset class.
   
5. Inside this column:
   a. Create a card element using Bootstrap card classes.
   b. Insert the birthday person's photo using the provided URL and make it circular using the `rounded-circle` Bootstrap class.
   c. Inside the card, create a card body.

6. Inside the card body:
   a. Add a card title with "Birthday Invitation".
   b. Create a paragraph with the invitation details:
      - The birthday person's name, date, time, and location.
   c. Add an RSVP button with a link to the provided RSVP link.

7. End the card body and close all HTML tags.

8. End the HTML document.

9. Save the HTML code in a .html file and upload it to your server.

10. Replace the placeholders (e.g., [Name], [Date], etc.) with the actual details of the birthday party in the HTML code.

11. Visitors can view the birthday invitation by visiting the URL of the uploaded HTML file on your server.

12. Guests can click the RSVP button to respond to the invitation.

13. The HTML file will display the invitation with the Bootstrap styling and the provided information.

End of Algorithm.

steps

Step by step

Solved in 4 steps with 2 images

Blurred answer
Follow-up Questions
Read through expert solutions to related follow-up questions below.
Follow-up Question

Please fix these in the above splution, it is not fully correct.

"You're invited" needs to be formatted correctly. With a larger font, using BS classes only.

Use Bootstrap classes to make a circular image with a border - around the image only.

"Don't tell the cats" color should be set with BS classes.

Solution
Bartleby Expert
SEE SOLUTION
Knowledge Booster
Developing computer interface
Learn more about
Need a deep-dive on the concept behind this application? Look no further. Learn more about this topic, computer-science and related others by exploring similar questions and additional content below.
Similar questions
Recommended textbooks for you
Database System Concepts
Database System Concepts
Computer Science
ISBN:
9780078022159
Author:
Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher:
McGraw-Hill Education
Starting Out with Python (4th Edition)
Starting Out with Python (4th Edition)
Computer Science
ISBN:
9780134444321
Author:
Tony Gaddis
Publisher:
PEARSON
Digital Fundamentals (11th Edition)
Digital Fundamentals (11th Edition)
Computer Science
ISBN:
9780132737968
Author:
Thomas L. Floyd
Publisher:
PEARSON
C How to Program (8th Edition)
C How to Program (8th Edition)
Computer Science
ISBN:
9780133976892
Author:
Paul J. Deitel, Harvey Deitel
Publisher:
PEARSON
Database Systems: Design, Implementation, & Manag…
Database Systems: Design, Implementation, & Manag…
Computer Science
ISBN:
9781337627900
Author:
Carlos Coronel, Steven Morris
Publisher:
Cengage Learning
Programmable Logic Controllers
Programmable Logic Controllers
Computer Science
ISBN:
9780073373843
Author:
Frank D. Petruzella
Publisher:
McGraw-Hill Education