Css Stuff Flashcards
How do you select an element in CSS, which is a direct child of another element?
section > p
How do you select an element in CSS, which is a child of another element?
section p
How do you select an element in CSS, which is the next sibling of another element?
p + p
How do you select a certain div that has a class, but not other elements with same class?
div.class
How do you select all next elements that are beside div?
div ~ elements
How do you select a first child of type ‘p’ inside a div?
div p:first-child
How do you select an element, that is the only element inside of a div?v
div element:only-child
How much specificity points are classes worth? IDs? Tags? Important or inline styles? To override a rule, do you need more or less specificity?
Tags : 1
Classes : 10
IDs: 100
Important and inline: 1000
You need more
What does CSS rule “position:static” do?
What about relative and absolute?
Fixed?
Position static is default position that means the element is unpositioned
Position relative is just like static, but can be moved by using top, left, bottom, right. Gap left by this is not filled by other elements
Position fixed is relative to viewport. Does not leave a gap
Position absolute is fixed, but relative to a nearest positioned element. Does not leave a gap too
How to select an element that is third in a container
element:nth-child(3)
How to select a second from last element in container?
Element:nth-last-child(2)
This looks at the second element, and only selects it if it’s of type “Element”
How to select a first element of a specific class?
.class:first-of-type
How to select all even elements in a container?
Every Second element of type “element”?
Every second element starting from the third?
element: nth-of-type(2n)
element: nth-of-type (even)
element: nth-of-type (2n+3), where 2n is every ‘2’ element, and 3 is an element which is included and started from
How to select an element, which is the only one of it’s type inside a container?
Container element:only-of-type
How to select a last element of it’s class in a container?
container .class:last-of-type