display property
+block: It won't let anything sit next to it on the page! It takes up the full width.
+inline-block:This makes the element a block box, but will allow other elements to sit next to it on the same line.
+inline:This makes the element sit on the same line as another element, but without formatting it like a block. It only takes up as much width as it needs
+none: This makes the element and its content disappear from the page entirely!
Sketching it out
The margin is the space around the element. The larger the margin, the more space between our element and the elements around it
The border is the edge of the element. It's what we've been making visible every time we set the
border
property.
The padding is the spacing between the content and the border. We can adjust this value with CSS to move the border closer to or farther from the content.
The content is the actual "stuff" in the box. If we're talking about a
floats:we determine where an element on the page
<p>
element, the "stuff" is the text of the paragraph.floats:we determine where an element on the page
clear:will immediately move below any floating elements on the of the page;
absolute positioning. When an element is set to
position: absolute
, it's then positioned in relation to the first parent element it has that doesn'thave position: static
Relative positioning is more straightforward: it tells the element to move relative to where it would have landed if it just had the default static
positioning.
fixed positioning anchors an element to the browser window—you can think of it as gluing the element to the screen. If you scroll up and down, the fixed element stays put even as other elements scroll past.
Không có nhận xét nào:
Đăng nhận xét