Main content
Computer programming
Course: Computer programming > Unit 2
Lesson 2: Intro to CSSQuick tip: Selecting by tag name
As you just learned, we use CSS rules to select elements on a web page so that we can then style those elements.
The way we tell our CSS rule which HTML elements to style is by using selectors. There are many types of selectors that we'll cover later, but here we just want to review the one we showed in the talk-through: the element selector.
The element selector selects HTML elements based on their tag names. Each HTML element—
<h1>, <p>, <li>, <body>—and any other HTML element can be selected with CSS by using the tag name without the angle brackets (< and >). For example, you can select all of the <p> tags in your webpage by using the element selector p. Here's a CSS rule that changes the color of each paragraph on a web page:p {
color: rgb(255, 0, 0);
}Let's check if that made sense. Which of these rules would select all of the
<h2> elements on a page?You'll try out using element selectors with different tag names in the next challenge. As you're experimenting, pay attention to what effect your CSS rules have on the page - which elements change color and don't.
Want to join the conversation?
Dose it helps if you learn JS , HTML and CSS ?(134 votes)
HTML, CSS and JavaScript are essential tools for front end web developers. If you're curious, here are two descriptions of what front end web developers do:
https://en.wikipedia.org/wiki/Front-end_web_development
https://www.techopedia.com/definition/29569/front-end-developer(46 votes)
I feel like I needed to start learning this five years ago. How much should I learn a day? I feel like if I do to much I'm gonna burn out. But I want to get a good knowledge of this before collage.(29 votes)
it's fine. I started learning programming like 3 or 4 months ago, and I'm already at jQuery.
for how much you can learn a day, I usually do one lesson a day.
Hope I helped!(21 votes)
which tag should be used to colorize a particular word in a paragraph(74 votes)- <span style="color:red";> particular word </span>(5 votes)
- how do i get the HTML page outside Khan academy(21 votes)
- Before Khan Academy, I learnt HTML and JavaScript basics with CoffeeCup. It is great.(6 votes)
how would you put gradients on a webpage with css?(12 votes)
With CSS Gradients of course! The good news is that they are easy to define and are can be used just like solid colors are. Be careful though, browsers like Internet Explorer have limited support for this feature. Let's start with thelinear-gradient, it is a function that takes two colors and an optional direction. Here's how simple it is with CSS:#gradient {
background: linear-gradient(red, yellow);
}
Wasn't that easy? As you learn more about gradients, you'll find that you can make them diagonal as well by defining the direction in degrees:#gradient {
background: linear-gradient(45deg, purple, blue);
}
It only gets better, linear gradients are a bit boring, butradial-gradientsare much better. They are a bit more complicated than linear gradients, but that won't stop us:#gradient {
background: radial-gradient(red, yellow);
}
You can learn much more about them here: https://www.w3schools.com/css/css3_gradients.asp
Good luck and happy coding!(38 votes)
- I have 10 million power in rise of kingdoms(21 votes)
- Can you possibly change the color of a picture using CSS and HTML?(14 votes)
Without a photo editing program, you would have to individually color each pixel. So I guess its possible, it would just take time.(8 votes)
What does rgb stand for in this code?
h1 {
color: rgb(0, 0, 0);
}
Does it have to do with the rules of CSS?(5 votes)
RGBstands for red, green, and blue, the three primary colors in computer graphics. The first value is the amount of red, the second is the amount of green, and the third is the amount of blue, and by havingrgbbefore them, the editor knows those three numbers correspond to RGB.(17 votes)
how would you input a game such as a flash or HTML5 game onto a website(8 votes)
hiya ~ as far as i know, you can use JavaScript for that.(1 vote)
how do you make one h2 go a colour and not all of the h2s(3 votes)
Assign the h2 in question (or any element really) a class, eg.<h2 class="mainHeader">This is my header</h2>
Then in your CSS you would write,.mainHeader {colour: #FFFFFF}
or,h2.mainHeader{colour: #FFFFFF}
if you only want to change the style of h2s with that class instead of changing anything with that class.
I hope this helps.(15 votes)