INTERACTIVE DESIGN - Exercise 3

  INTERACTIVE DESIGN - Exercise 3

|| 22/10/2025 – 2/11/2025 (Week 5 – Week 6)
|| Yang Shumeng 0378848
|| Interactive Design / Bachelor of Design (Honours) in Creative Media
|| Interactive Design / Exercise 3

TABLE OF CONTENTS

1. Instructions
2. Process Work

1. Instructions：

2. Process Work：

Exercise 3 - Creating a Recipe Card

Create an HTML file named "index.html."
Create a section that displays the following information:
Recipe title
Include necessary images for the page
List of ingredients
Step-by-step cooking instructions

Apply the style element in your document.
Apply CSS rules to style your recipe card.
Use CSS selectors such as element selectors (e.g., body, h1, ul), class selectors (e.g., .recipe-title, .ingredient-list), and ID selectors (e.g., #instructions) to style different parts of the card.

Here is my code:link
html:

评论

发表评论

此博客中的热门博文

Typography | Task 1: Exercises

图片
  Typography | Task 1: Exercises LIST / JUMPLINK Lectures Instructions Exercises Feedback Reflections Further Readings 21.4.2025 - 26.5.2025（Week 1 - Week 6) Yang Shumeng（0378848） Typography / Bachelor of Design (Honours) in Creative Media / Taylors University Task 1 / Exercises LECTURES Week 1 Typo_0_Introduction During this lecture, we've grasped the significance of typography. Typography is a crucial cornerstone in all design fields. It sharpens our eye for detail and hones our compositional abilities. Widely utilized in web design, app interfaces, logo creations, book layouts, and poster designs, it serves a...
阅读全文

DIGITAL PHOTOGRAPHY AND IMAGINE

图片
  21.4.2025 - 26.5.2025（Week 1 - Week 6) Yang Shumeng（0378848） DPI / Bachelor of Design (Honours) in Creative Media / Taylors University  Exercises LIST / JUMPLINK Lectures Instructions Exercises Feedback Reflections Further Readings LECTURES WEE K1 This class introduced digital photography fundamentals, showing how science and art merge in design. Key points: • Learned Photoshop: A vital tool for designers/photographers, crucial for image editing/manipulation. • Creative techniques discovered: Broadened perspectives, sparked enthusiasm for future learning. • Photoshop’s value: Powerful yet user-friendly, enabling creative ideas in tasks like designing business cards, restoring old photos, and cartoonizing images—offers endless visual expression possibilities. EXERCISES graphic design composition work 1          • Eye - catching composition: Geometric shapes such as circles and squares cut through the picture, breaking the convention. They create a uni...
阅读全文

Illustration and Visual Narrative—task1

图片
ILLUSTRATION & VISUAL NARRATIVE | TASK 1: EXERCISES -  April 21, 2025 21/04/25 - 12/05/25 (Week 1 - Week 4)  Yang Shumeng,0378848 Illustration and Visual Narrative Task 1: Exercises TABLE OF CONTENTS 1. Lectures 2. Instructions 3. Task 4. Reflection Lectures Week 1 During our first tutorial, Mr. Hafiz introduced us to Adobe Illustrator , a powerful tool for creating vector graphics. We began by exploring two key types of digital images: Raster Images Made up of individual pixels, these images lose clarity when enlarged. Common file types include JPG and PNG . Vector Images Constructed from mathematical paths, these can be scaled infinitely without quality loss. Typical formats are AI and SVG . A key point discussed was the issue of missing links when importing external images or Illustrator files into a project. Mr. Hafiz explained how to avoid this by properly embedding assets. We also reviewed several important file formats used in Il...
阅读全文