Congratulations again for seeing one of the best Tweets you will read online today: We're are starting our CSS coding Journey from scratch.
Course: HTML, CSS & JAVASCRIPT
Topic: CSS
I'll break this down for you like you're two, kindly retweet for others, and let's begin.
Hello students', Welcome to your first class on CSS. To avoid missing subsequent classes, kindly follow me and on tweet notifications.
If you are seeing this for the first time, you can take all the 3 previous HTML classes we've had using the Twitter Moment in my pinned Tweet.
We’ve had just five previous classes on HTML, and they were straightforward and well explained.
Before I dabble into CSS and commence its total destructions, let’s do a bit of recap on HTML and refresh our memory
-Access to Internet and Twitter to check and recheck my threads
-IDE tool and I recommend VsCode
-Unshiverable Determination and InshAllah
Here is everything we did in HTML
If you remember all of these, which I assume you will as you’ve been taught and given exercises, then let’s get into CSS.
What is CSS?
CSS: Cascading Style Sheet It is basically used to beautify your web pages after writing the HTML. see the image below for before and after CSS
One way, which we’ve already explored in previous lessons, is to use the style attribute on an HTML element:
Check example below
This video tutorial will give an in-depth explanation of the entire thread, creating external CSS files and more
Let’s deconstruct the above example. CSS files comprise a set of rules, each consisting of a selector (to indicate which elements you are trying to modify), followed by a declaration block that contains a set of properties and those properties’ values.
Notice the use of the “style” HTML element nested in the head. “style” can be used to place CSS rules inline with an HTML document, like in the example above.
Although this is a perfectly valid way of adding CSS to your web pages, it would be better to use external CSS
If you are using a mobile phone. The Sololearn IDE already linked this so just copy and paste a CSS for your HTML code on the CSS side.
For those using VsCode IDE
In your VsCode, create another file named style.css and link to it to your HTML code like this.
CSS SELECTOR
The three basic kinds of selectors are: 1. type selectors: used to select HTML elements by element name 2. class selectors: used to select HTML elements by a specific class value 3. id selectors: used to select an HTML element associated with a specific id value
Using a type selector is as simple as typing the name of the element:
Use the code below as an example.
Using a class selector is done by placing a . followed by the name of the class value: See example:
Using an id selector is done by placing a # followed by the id value: Example below.
Let’s take another look at “type,” “class,” and “id” selectors in action to see how CSS rules are applied:
Multiple Element Selection in CSS
To select multiple elements, separate the selectors by commas, like this:
From the above picture, you will notice I selected (h1 and p) tag together and (ingredientslist and instructionslist), then I applied a single CSS. Let’s
We have come to the end of today's class; I hope you enjoyed it. See you on Wednesday
Do not forget to retweet the main tweet for others to find it and follow @SwiftspeedT for your upcoming Scholarship
Excercise: Screenshot your code and Output and quote or reply in the comment
Video summary of todays class.
It’s just one 😉, detailed, short and simple. Watch and share
As it is with that saying, " this is what your lecturer won't teach you in class."
I have taken my time to compile things I did not teach you in our coding class because I do not want you to see it elsewhere and look dumb.
Kindly. Let us start with COMMENTS.
So far, we have had 3 HTML Classes and mentioned a couple of abbreviations that you should be able to tell me even if I wake you up from your sleep.
Here you go
Whatever is worth doing is worth doing well. I do not like you using your phone to take a picture of your screen to show me your work. It is not all that sleek, so check this out
The moment we’ve been waiting for is all here. Congratulations to my students & I Mheen. Deal secured.
In 3-4 month I might be having my first set frontend web development grads with certificate.
Please take your classes seriously. Scholarship is imminent. Announcements later
Man I’m so happy for you guys in advance🥺❤️
This is what we need, giving opportunities to everyone that cares to get it.
Free digital education…
It will help a lot of youths. Please and please, always engage my tech tweets there are still a lot of people who have zero idea about this opportunity yet
How to become a millionaire this year, surest path
**Learn JavaScript
**Learn API
**Start your own web project
**Learn Java or Kotlin (Android)
**Learn Swift (IOS)
**Learn flutter (cross platform)
**Build your own app
**Stop playing bet!
Pray about it, thank me later
This year, I’ll teach you most of these
E.g
JavaScript
Api
Flutter
After knowing these 3, you should be able to build most website and app ❤️.
Please avoid betting this year, it’s a scheme to ruin your life. No matter what anyone says, you’ll lose more than you win!
Follow me to learn programming, Tech Money Lama KoJe ni 2022😉
Congratulations, you are seeing this Tweet. Kickstarting your career in Tech has been fruitful as we will be coming to the end of HTML after today's class
Course: HTML, CSS & JAVASCRIPTS
Again I will break this down like you are 4 years old, kindly retweet for others, and join.
Dear students' welcome to your last class on HTML.
If you are just joining us, we have had two previous classes; follow me and on to avoid missing classes and take all two previous classes using the Twitter Moment on my pinned tweet.
HTML SEMANTICS
DIV
The <div>, a block-level element, allows you to section into separate, logical divisions.
ID
The id attribute provides you with the ability to give any element a unique identifier. This identifier can later be used to apply specific styles with CSS
Congratulations, you are seeing this Tweet; here is another life-changing opportunity to transition into tech this year. Another programming class on:
Course: HTML, CSS & JAVASCRIPT
I'll explain to you like you are 4 years old, kindly retweet for others, and join the class.
Welcome to your 2nd class on HTML. Kindly follow me and switch on my tweet notification to avoid missing subsequent classes.
If you are just finding this for the first time, the previous class is on my pinned tweet, and you might want to check and catch up with us.
In the previous class on HTML, we did a comprehensive introduction to web development, and I taught you how to install the needed tool to get started; by now, I assumed you have the required IDE. So let us get to class
Recalled that last class, I told you the full meaning of HTML