100 days of code (from day 20)

Hello, again. Yeah, it's been five days since I last dropped a report here. We just rounded up day 24 and day 25 task will be out soon. So I'll be dropping all what we've done from day 20 to day 23. Don't mind the tenses I used for the previous days. As usual, they were written on the said date.

Day 20
We are still on Cascading Style Sheet. We continued with external styling. This time, another dimension was used. We created different classes and styled them together. A task was set and we were to follow the example stated. The instruction was to style the "p" element present inside the "earth" id.
Use the same style for the last 3 classes and leave the alien id unstyled. Here is a screenshot of the work.

The only tags to be styled were those four, so I styled them all together. That's the task for today! This is the output:

See you on day 21!

Day 21
Still on styling, we did another thing today. This time, we styled a sentence, a very long sentence actually. First, we placed it in a paragraph tag. The p tag was styled in the style.css file.
Check below:

The first thing I did was move the texts to the right. The output is below; you should see all the texts aligning to the right. Then I gave it a font size of 15px. The font weight is bolder and three fonts were used incase the browser doesn't recognize the first and second. My chrome actually recognized the first, so Vedana was used. The line height, just as its name implies is the line between the texts. It was set at 40px.
Check the output below:

See y'all on day 22!

Day 22
Today is all about text shadows. Shadows as its name implies is what it is. Sometimes, you might come across texts that has its shadow overlapping it. The shadows might have different color aside the original color, but most times, it makes the texts beautiful. Most designers uses it on fliers and front page websites. We learnt how to do it in today's task.

First, we created an header that housed the text we styled. The HTML and CSS file is shown below.

So, I made the color of the text red according to the task, and the shadow is made black with 5px each. You can see the output below:

And that's it for today. See you on day 23!

Day 23
Today, we brought in an image and did some styling on it. We worked on box shadows actually. It's as if the image was placed in a box, while some part of the box or shadows of the box were showing. It's really pretty and it was achieved with simple codes.

Check out the HTML and CSS file...

So I created a class for the image named box. The box class is what I styled. Everything I did to the box reflected on the image. First, I gave it a specific height and width as specified on the task post. Then the box shadow gave it what I wanted.

Output can be seen below:

Till we meet again!