HTML块级标签汇总(小篇)


Posted in HTML / CSS onJuly 13, 2016

块级元素,简单来说,就是自己独占一行的元素。其特点

①总是在新行上开始;

 ②高度,行高以及外边距和内边距都可控制;

 ③宽度缺省是它的容器的100%,除非设定一个宽度。

④它可以容纳内联元素和其他块元素

汇总代码如下:

XML/HTML Code复制内容到剪贴板
  1. <!doctype html>  
  2. <html>  
  3. <head>  
  4.     <meta charset="UTF-8">  
  5.     <title>Document</title>  
  6. </head>  
  7. <body>  
  8.     <!-- 块状元素 独占一行 -->  
  9.     <!-- div无语义,称它为盒子 -->  
  10.     <div>盒子</div>  
  11.     <!-- h1-h6语义 定义标题 -->  
  12.     <h1>标题1</h1>  
  13.     <h2>标题2</h2>  
  14.     <h6>标题3</h6>  
  15.     <!-- p 语义 段落标签 写文字-->  
  16.     <p>文章</p>  
  17.     <!-- 列表多数用来存一系列的相似的数据 -->  
  18.     <!-- 有序列表 -->  
  19.     <ol>  
  20.         <li>导航1</li>  
  21.         <li>导航2</li>  
  22.         <li>导航3</li>  
  23.     </ol>  
  24.     <!-- 无序列表 -->  
  25.     <ul>  
  26.         <li>导航1</li>  
  27.         <li>导航2</li>  
  28.         <li>导航3</li>  
  29.     </ul>  
  30.     <!-- 定义列表 解释某个名词 -->  
  31.     <dl>  
  32.         <dt>名词</dt>  
  33.         <dd>解释名词的位置</dd>  
  34.     </dl>  
  35.     <!-- 表格 渲染性能不好 少用 -->  
  36.     <table>  
  37.         <caption>表格头部</caption>  
  38.         <!-- tr是行 -->  
  39.         <tr>  
  40.             <!-- th表头 -->  
  41.             <th>星期一</th>  
  42.             <th>星期二</th>  
  43.         </tr>  
  44.         <tr>  
  45.             <!-- td单元格 -->  
  46.             <td>上课</td>  
  47.             <td>上课</td>  
  48.         </tr>  
  49.     </table>  
  50. </body>  
  51. </html>  

以上所述是小编给大家介绍的HTML块级标签汇总(小篇),如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

HTML / CSS 相关文章推荐
CSS中垂直居中的简单实现方法
Jul 06 HTML / CSS
HTML5+CSS3 实现灵动的动画 TAB 切换效果(DEMO)
Sep 15 HTML / CSS
CSS3 实现的缩略图悬停效果
Dec 09 HTML / CSS
html5组织文档结构_动力节点Java学院整理
Jul 11 HTML / CSS
详解HTML5之pushstate、popstate操作history,无刷新改变当前url
Mar 15 HTML / CSS
SVG实现多彩圆环倒计时效果的示例代码
Nov 21 HTML / CSS
canvas进阶之如何画出平滑的曲线
Oct 15 HTML / CSS
怎样实现H5+CSS3手指滑动切换图片的示例代码
May 05 HTML / CSS
前端实现背景虚化但内容清晰且自适应 的实例代码
Aug 01 HTML / CSS
HTML5 3D旋转相册的实现示例
Dec 03 HTML / CSS
HTML5实现直播间评论滚动效果的代码
May 27 HTML / CSS
CSS的calc函数用法小结
Jun 25 HTML / CSS
HTML5进阶段内联标签汇总(小篇)
Jul 13 #HTML / CSS
关于HTML5语义标签的实践(blog页面)
Jul 12 #HTML / CSS
HTML5学习心得总结(推荐)
Jul 08 #HTML / CSS
HTML5之语义标签介绍
Jul 07 #HTML / CSS
HTML5之tabindex属性全面解析
Jul 07 #HTML / CSS
用html5的canvas和JavaScript创建一个绘图程序的简单实例
Jul 06 #HTML / CSS
HTML5本地存储之Web Storage详解
Jul 04 #HTML / CSS
You might like
解决MySQL中文输出变成问号的问题
2008/06/05 PHP
phpmyadmin出现Cannot start session without errors问题解决方法
2014/08/14 PHP
PHP单例模式详解及实例代码
2016/12/21 PHP
PHP获取php,mysql,apche的版本信息及更多服务器信息
2021/03/09 PHP
JS解密入门之凭直觉解
2008/06/25 Javascript
动态载入/删除/更新外部 JavaScript/Css 文件的代码
2010/07/03 Javascript
js滚动条回到顶部的代码
2011/12/06 Javascript
单击复制文字兼容各浏览器的完美解决方案
2013/07/04 Javascript
JavaScript中setInterval的用法总结
2013/11/20 Javascript
escape函数解决js中ajax传递中文出现乱码问题
2014/10/30 Javascript
jQuery Mobile 和 Kendo UI 的比较
2016/05/05 Javascript
详解Javascript数据类型的转换规则
2016/12/12 Javascript
浅述节点的创建及常见功能的实现
2016/12/15 Javascript
Node.js readline 逐行读取、写入文件内容的示例
2018/03/01 Javascript
菊花转动的jquery加载动画效果
2018/08/19 jQuery
vue-cli3.0 环境变量与模式配置方法
2018/11/08 Javascript
Vue中Table组件行内右键菜单实现方法(基于 vue + AntDesign)
2019/11/21 Javascript
[40:57]TI4 循环赛第二日 iG vs EG
2014/07/11 DOTA
python创建只读属性对象的方法(ReadOnlyObject)
2013/02/10 Python
跟老齐学Python之关于循环的小伎俩
2014/10/02 Python
Python map和reduce函数用法示例
2015/02/26 Python
完美解决python3.7 pip升级 拒绝访问问题
2019/07/12 Python
django中的图片验证码功能
2019/09/18 Python
将python安装信息加入注册表的示例
2019/11/20 Python
Python基于requests实现模拟上传文件
2020/04/21 Python
python链表类中获取元素实例方法
2021/02/23 Python
Omio美国:全欧洲低价大巴、火车和航班搜索和比价
2017/11/08 全球购物
施华洛世奇意大利官网:SWAROVSKI意大利
2018/07/23 全球购物
小学教师岗位职责
2013/11/25 职场文书
师范生个人推荐信
2013/11/29 职场文书
赔偿协议书范本
2014/04/15 职场文书
广告宣传策划方案
2014/05/21 职场文书
国际经济贸易专业自荐信
2014/06/13 职场文书
转让协议书范本
2014/09/13 职场文书
女性健康知识讲座主持词
2015/07/04 职场文书
Win11电源已接通但未充电怎么办?Win11电源已接通未充电的解决方法
2022/04/05 数码科技