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!!
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!!
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.
Step by step
Solved in 4 steps with 2 images
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.
by Bartleby Expert
