Categories
CSS HTML JavaScript Tools & Generators

Setting Up A TailwindCSS Project

To Install Tailwind:Open your project in Visual Studio Code. Go to Terminal > New Terminal Type npm install -D tailwindcss To Initialize your project, type Then create two folders inside your project. Name them build and src In the SRC folder, make a file called input.css In the BUILD folder, make a file called index.html In tailwind.config.js, edit […]

Categories
CSS HTML

TailwindCSS Exercise 2024: Transmetropolitan

First please download the starter files. Now please download the screenshots. Finally, here is a Loom video describing what you will produce. Tailwind Videos A short Loom series on using Tailwind. Killer Shortcut If you go to the tailwindcss website, the keyboard shortcut Ctrl-K will allow you to search the documentation very efficiently. Tailwind Setup […]

Categories
CSS HTML

Protected: HTML/CSS Layout Exercise: Set the Controls for the Heart of the Sun

There is no excerpt because this is a protected post.

Categories
CSS HTML

Protected: HTML/CSS Layout Exercise: Dogbreath In the Year of the Plague, 2024

There is no excerpt because this is a protected post.

Categories
CSS

Flex Playground Class Exercise: Light Blog 2024

In this exercise, we are going to explore flexbox and some new ways of working with color in css. First, please download the starter files. Colors to Use Topics We Will Also Explore Resources

Categories
CSS WordPress

WordPress Full Site Editing Exercise: “Ducks” 2023

For this exercise, you will make a WordPress theme using Full Site Editing. You will use the editor, as well as custom css. Here are the resources you will need for the exercise: Install the Duplicator archive in your testing environment. If This Is A Test If this is a test, you are responsible for […]

Categories
CSS HTML

Container Query Exercise

In this exercise, you will need to use container queries. First, please download the required images. Then, please examine the screenshots. And finally, watch this short Loom video. If this is a test, you may use your notes or the Internet. Talking with anyone other than me, an IA, or other exam invigilator will result […]

Categories
CSS HTML JavaScript

Intro to Front End Libraries: Bootstrap

Bootstrap is a popular web development library of pre-built HTML, CSS, and JavaScript components. Developed by Twitter, it gained widespread adoption due to its ease of use and ability to create responsive websites. Bootstrap simplifies the web development process by offering a set of ready-to-use mobile-first UI components, such as buttons, navigation bars, forms, grids, […]

Categories
CSS HTML JavaScript

JazzClass.Com Sign Up Form Exercise With Container Queries & Srcset and Sizes

In the following exercise, you will make a sign-up form and a gallery. You will also need to use container queries and the srcset and sizes attributes. To begin, please download the files you will require. In the downloaded archive, you will find the following: Change the name of thedownloaded folder to your-full-name-jazzclass. You can […]

Categories
CSS HTML

Jim Jarmusch Resume (Awards) Exercise 2023

First, please download the starter files and the screenshots. Then watch this Loom video to see the layout you need to created. You must use SASS in this exercise. Make a logical project structure. The minimum requirement is that you use variables for all colors and fonts. Use a mobile first methodology to compose your […]