HTML, CSS, and Bootstrap Exercises
HTML Exercises
1. Create a basic HTML page with the following structure:
- A title in the <title> tag.
- A header <h1> with the text "Welcome to My Page".
- A paragraph describing yourself (<p>).
- Add an image with an <img> tag and link to an external site using an <a> tag.
2. Create an ordered list (<ol>) with at least 5 items.
- Customize the list numbering (e.g., Roman numerals, letters).
3. Add a table with 3 rows and 2 columns:
- Row 1: Headers "Name" and "Age".
- Row 2: "Alice", "25".
- Row 3: "Bob", "30".
CSS Exercises
1. Create a CSS file to style the HTML page:
- Change the background color of the body.
- Style the header <h1> to have a different font-family and color.
- Center-align the paragraph (<p>).
2. Create a class in CSS named "highlight" to:
- Add a yellow background color.
- Add padding of 10px.
3. Use inline styles to set a font size of 20px for one paragraph.
Bootstrap Exercises
1. Create a Bootstrap grid system with:
- A container.
- A row with 3 columns. Each column should have different text.
2. Add a navigation bar using Bootstrap:
- Include links such as "Home", "About", and "Contact".
3. Use a Bootstrap button with a class "btn btn-primary".
- Add another button with a secondary style.
4. Create a responsive card using Bootstrap that includes:
- An image at the top.
- A title and text below the image.
- A button inside the card.
