Please enable JavaScript.
Coggle requires JavaScript to display documents.
W4 & W5 - HTML/CSS Patterns (CSS Patterns (Position and Group…
W4 & W5 - HTML/CSS Patterns
Core structural elements
<html>
<head>
Info about HTML document goes in this,
<body>
Document content goes in this
Block v/s Inline Elements
Block Elements
are those that take up
full width
available on page,
effectively blocking out
other elements from
sitting next to it
3 types
structural block
structure
document to provide enhanced view
terminal block
terminate
document structure to insert content
multi-purpose block
Inline elements
take up
as much width as needed
to display contents; therefor allowing other elements
to be in line
with inline element
3 types
semantic
flow
inline-block
Class and ID attributes
class
identify elements being in the same class where you want to affect this class of content
id
uniquely
identify an element
CSS Patterns
Position and Group Selectors
based on child
Attribute Selectors
on whether contain attribute
Pseudo-element Selectors
first letter or first line of element
Pseudo-class Selectors
style hyperlink whether visited,,,