Mini Project 7. Sketch Gallery

https://reonluck.github.io/reon-cclab/noisy/

This work is my first CSS+HTMl work, an unskilled attempt.

The top half of the work consists of p5.js and text, using css style to adjust the padding, border and background color, so that the background tone matches my design.

In the second half, I used HTML as the main design method, and made the overall effect of the work like a gallery by inserting images and designing the layout of the text.

Technology Implementation

What is presented above is the use of the class function to make the canvas a whole. The specific implementation process is to establish let cnv= createCanvas to establish the connection, so as to achieve the effect of modifying the work.

This is followed by the effect of importing the image and editing its position. By adjusting the float function and the text, a brief description of the work appears on the right side of the work.

The image above shows the use of css to design fine designs, such as fonts, word sizes, etc.

Reflection:

This is the first time I’ve used CSS and HTML for design, so I’d say I’m not very skilled overall, and there’s a lot of room for improvement.

Leave a Reply