div块级标签

功能:

块级元素,霸占一行

用于页面结构

span内联级标签

功能:

行内元素,可与其它行内标签共处一行

用于页面布局

表格标签 table家庭

table 表格的最外层容器

<table></table>
  • border属性 定义表格的边框,设置值是数值
  • cellpadding属性 定义单元格内容与边框的距离,设置值是数值
  • cellspacing属性 定义单元格与单元格之间的距离,设置值是数值
  • align属性 设置整体表格相对于浏览器窗口的水平对齐方式,设置值有:left | center | right
  • width属性,设置宽

tr 行标签

<tr></tr>

tr,代表一行。一个表会有多个行

它直属于table

td 单元格标签

<td></td>

单元格是位于行中的

表格的一行里面,会有多个单元格

》单元格标签的属性

  • align 设置单元格中内容的水平对齐方式,设置值有:left | center | right
  • valign 设置单元格中内容的垂直对齐方式 top | middle | bottom
  • colspan 设置单元格水平合并,设置值是数值
  • rowspan 设置单元格垂直合并,设置值是数值
  • width 设置宽
  • height 设置高

th 单元格标题标签

如果单元格是小标题性质,用此标签,单元格会加粗,文本居中

表格功能的演练

使用表格标签完成以下表格的制作

单元格的宽分别为

80 120 80 120 120

颜色编码参考

https://www.114la.com/other/rgb.htm

鸣人的图片

https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=723821193,819125884&fm=26&gp=0.jpg

前端开发 容器标签 0226相关推荐

  1. 前端开发 容器标签span与div 0228

    span 标签 例子 div标签 让容器的内部居中 样式 让整个容器相对于父一级居中 例子 总结

  2. 前端开发_HTML5_标签部分(一)

    一.如何快速学习标签?     1.记住标签对应的单词     2.该标签在页面产生的作用     3.为了更好的使用该标签,常用的属性有哪一些? 二.结构标签(doctype/html/head/m ...

  3. Web前端开发 table标签相关用法和属性

    table标签 html中的<table>标签,通常用于对页面布局的规划. 一.<table>标签简介 table标签用于在网页中建立表格布局,其子标签有<tr>& ...

  4. Web前端开发 列表标签相关用法和属性

    一.有序列表 <ol></ol>  有序列表 需要与<li></li>标签连用,<li>标签为数据标签,有序列表中li标签会按照顺序进行排列 ...

  5. [ 前端开发 ] label标签的使用

  6. 前端开发课件 202002

    html 加百利 前端开发-认识前端开发-0226_pyhui的技术博客-CSDN博客 https://blog.csdn.net/ifubing/article/details/104513261 ...

  7. 实战react技术栈+express前后端博客项目(8)-- 前端管理界面标签管理+后端对应接口开发...

    项目地址:https://github.com/Nealyang/R... 本想等项目做完再连载一波系列博客,随着开发的进行,也是的确遇到了不少坑,请教了不少人.遂想,何不一边记录踩坑,一边分享收获呢 ...

  8. 在docker的Linux容器搭建前端开发环境

    随着开发的深入,前端开发已经不局限于简单的本地开发坏境的搭建与调试.运维方面,目前的服务器使用的基本上都是linux系统,了解下Linux系统原理与一些常用的配置和指令,对我们的开发和部署以及排除线上 ...

  9. 移动前端开发中添加一些webkit专属的HTML5头部标签,帮助浏览器更好解析html代码,更好地将移动web前端页面表现出来。本文整理一些常用的meta标签...

    <!DOCTYPE html> <!-- 使用 HTML5 doctype,不区分大小写 --><html lang="zh-cmn-Hans"> ...

最新文章

  1. 简单介绍Tomcat中catalina.out 和 catalina.log的区别和用途
  2. 幸运数字Ⅱ(树型结构构造答案,打表)难度⭐⭐
  3. JavaScript原型-进阶者指南
  4. Mac下如何显示隐藏文件/文件夹
  5. 轻量级社会化分享openShare源码解析
  6. android jni new/delete 和 new[]/delete[]
  7. 高级程序设计c语言试卷答案,高级程序设计语言半期试卷答案.doc
  8. docker web程序本地化_Docker 容器化部署 Python 应用
  9. mysql 连接 监控_监控mysql上客户端的连接数
  10. oracle 密码过期 ora-01017,Oracle密码过期, 报:ORA-01017: 用户名/口令无效; 登录被拒绝...
  11. 01 - 雷达回波中的可用信息
  12. Android开发之各种好看的背景颜色
  13. 边境的悍匪—机器学习实战:第二章 端到端的机器学习项目
  14. 冰刃IceSword中文版 V1.22 绿色汉化修正版
  15. matlab 相位校正,科学网—全相位比值校正法 - 王兆华的博文
  16. 巧用Excel笔画排序,实现计算汉字笔画数
  17. 通过网线连接获取树莓派的ip地址
  18. 转载:“只要3分钟,我就能扒光你的隐私!” | 互联网时代,14亿中国人都在裸奔|你的隐私已不是隐私
  19. xmm1是什么器件_模拟电子技术multisim仿真1二极管特性仿真.ppt
  20. 根证书的有效期与服务器SSL证书一样长吗?

热门文章

  1. ip中继对接_朗视IPPBX为桃源居中澳实验学校打造IP语音校园!
  2. 计算机网络3-DNS域名解析系统
  3. layui弹框提示层:倒计时(layui-font-red颜色定义)
  4. elementUI解决el-checkbox自定义样式、@change样式的失效 等bug - 代码示例
  5. 计算机大学生个人特长范文,计算机大学生个人简历范文
  6. 开源的酷炫猜歌喝酒小程序
  7. 一个简单的性能计数器:CodeTimer
  8. C#如何去掉字符串中所有空格
  9. Linux:mysqldump 用法 数据库导出
  10. mysql 格式化日期 DATE_FORMAT,FROM_UNIXTIME,UNIX_TIME等