Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Impara Applying Website Styling With CSS | Building the Blog Website
AI Powered Web Development Essentials

bookApplying Website Styling With CSS

Goal

The next step is to add styles to our site so it doesn't look like raw HTML. We will also provide the colors we want to see on the website.

We can use the following source (https://colorhunt.co/) to select the color palette we like most.

We have selected such a color palette:

Possible Prompt

Create a CSS stylesheet that can be applied to that HTML, ensuring that it includes styling elements and adheres to the following color palette: #32012F, #524C42, #E2DFD0, and #F97300. Write the complete CSS code to achieve this, incorporating best practices for a visually appealing design.

Result

Important: The only change we need to make in our code is to connect the CSS file to the HTML file in the head.

index.html

index.html

index.css

index.css

copy

Website State

Video Tutorial

Tutto è chiaro?

Come possiamo migliorarlo?

Grazie per i tuoi commenti!

Sezione 4. Capitolo 3

Chieda ad AI

expand

Chieda ad AI

ChatGPT

Chieda pure quello che desidera o provi una delle domande suggerite per iniziare la nostra conversazione

Awesome!

Completion rate improved to 5

bookApplying Website Styling With CSS

Scorri per mostrare il menu

Goal

The next step is to add styles to our site so it doesn't look like raw HTML. We will also provide the colors we want to see on the website.

We can use the following source (https://colorhunt.co/) to select the color palette we like most.

We have selected such a color palette:

Possible Prompt

Create a CSS stylesheet that can be applied to that HTML, ensuring that it includes styling elements and adheres to the following color palette: #32012F, #524C42, #E2DFD0, and #F97300. Write the complete CSS code to achieve this, incorporating best practices for a visually appealing design.

Result

Important: The only change we need to make in our code is to connect the CSS file to the HTML file in the head.

index.html

index.html

index.css

index.css

copy

Website State

Video Tutorial

Tutto è chiaro?

Come possiamo migliorarlo?

Grazie per i tuoi commenti!

Sezione 4. Capitolo 3
some-alt