Scribd
Upload
2 views

CSS practice

The document provides an overview of CSS selectors, including simple, combinator, pseudo-class, pseudo-element, and attribute selectors, along with examples. It also explains the CSS class selector and how to insert CSS through external, internal, and inline methods. Additionally, it covers margin and padding properties, detailing their usage and the box-sizing property to maintain element width.

Uploaded by

leonelgomez
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
2 views

CSS practice

The document provides an overview of CSS selectors, including simple, combinator, pseudo-class, pseudo-element, and attribute selectors, along with examples. It also explains the CSS class selector and how to insert CSS through external, internal, and inline methods. Additionally, it covers margin and padding properties, detailing their usage and the box-sizing property to maintain element width.

Uploaded by

leonelgomez
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 3

You are not allowed to talk aloud at in the library.

I accept all people,except those who are cruel to others.


Here is a compliment for you, that dress really complement your eyes.
You are too nice tune I for your own good.
The capitol building is located in the capital of state.
I need to find a the side that can help me the side cite journal for my paper.
My ring is loose so I hope I don’t lose it. at loose it.
I suppose you think that I’m supposed to get this assigment done tonight.
They are coming to pick up their daughter this morning.
The child throw the ball throught the window.

CSS SELECTORS

5 selectors
-simple selectors (select elements based on name, id, class)
-combinator selectors (select elements based on a specific relationship between them)
-Pseudo-class selectors(select elements based on a certain state)
-pseudo-elements selectos (select and style a part of an element)
-Attribute selectors(select elements based on an attribute or attibute value)

The CSS class selector


The class selector selects HTML elements with a specific class attribute.
To select elements with a specific class, write a period(.) character, followed by the class name.

In this example only <p> elements with class=”center” will be red and center-aligned:
P. center{
Text-align: center；
Color: red;
}

ALL CSS SIMPLE SELECTORS


SELECTOR EXAMPLE EXAMPLE DESCRIPTION
#id #firstname selects the element with
id=”firstname”

.class .intro Selects all elements with


class=”intro”
Element.class P.intro Selects only <p> elements with
class=”intro”
* * Select all elements
element p Selects all <p> elements
Element, element,... Div, p Selects all <div> elements and
all <p> elements
3 ways to insert CSS
1. external css
2. Internal css
3. Inline css (high priority)

MARGINS

Margin properties are used to create space around elements, outside of any defined borders.

 margin-top
 margin-right
 margin-bottom
 margin-left

Shorthand property

Margin 25px 50px 75px 100px;

PADDING

Padding properties are used to generate space around an element’s content, inside of any
definded borders.

To keep the width at 300px, no matter the amount of padding, you can use the box-sizing property.
This causes the element to maintain its actual width; if you increase the padding, the available
content space will decrease.

You might also like