目录
文章目录
一.常见的网页布局
二.标准文档流
标准文档流常见标签
三.display属性
四.float属性
总结
一.常见网页布局
二.标准文档流
标准文档流常见标签
块级元素 | <div>、<p>、<h1>-<h6>、<ul>、<ol>等 |
内联元素 | <span>、<a>、<strong>、<em>、<img>等 |
三.display属性
在HTML中,display属性用于指定元素的展示方式。该属性可以接受以下几种值:
案例:
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><style>div{border: 1px seagreen solid;width: 100px; height: 100px;}span{border: 1px red solid;}</style></head><body><div>我是元素</div><span>我是Span元素</Span></body>
</html>
- none属性
设置的元素不会被显示。
div{width: 100px; height: 100px;border: 1px seagreen solid;display: none;}
- inline
元素被视为内联元素,并在同一行内显示。
div{width: 100px; height: 100px;border: 1px seagreen solid;display: inline;}
- inline-block
该元素被视为内联块级元素同时具有块元素和行元素的属性。即可设置宽度也可并行排列。
div{width: 100px; height: 100px;border: 1px seagreen solid;display: inline-block;}
- 总结--display特性
实现块级元素与行级元素的转变,控制块级元素排到一行,控制元素的显示和隐藏。
四.float属性