java web-1.2html-基本标签

idea创建html页面
方法：file->new->module->static web
学习资源
w3c school 学习资料手册

标签

• 文件标签
  html:根标签
  head:头标签 指定属性 引入资源
  title:标题
  body:体标签
  
• 文本标签

  <!--注释-->
  <br>换行
  <h1 to h6> 标题
  <p> 段落

  <hr>  加一条水平线  可以加属性
  <b>字体加粗
  <i> 字体斜体
  <font>改变字体 可以加属性 color颜色 size 大小 face 字体
  <center> 文本居中 相对于父元素

属性定义：

• color （百度取色器 取色）
  1.英文单词 red green blue
  2.rgb（值1,值2,值3）值范围 0-255
  3.#值1值2值3：范围00-FF之间
• width
  1.数值 width = ‘20’ 单位 像素
  2.数值% 占比相对于父元素的比例

特殊字符

• 图片标签
  <img src="D:/picture/1.jpg" align="right" alt="古镇"/>当图片加载失败时候出现alt的文字
  src +路径
  相对路径以.开头的路径 ./:当前目录 …/:上一级目录
  
• 列表标签
  有序列表 ol type 改变标号 123 还是abc
  无序列表 ul type改变类型
  
  
• 超链接标签
  <a></a>定义一个超链接
  属性 href：指定访问资源的url
  
  target 指定打开资源的方式

<a href = "http://www.baidu.com" target="_self">点我</a> 和不加一样 当前页面打开
<a href = "http://www.baidu.com" target="_blank">点我</a>  空白页面打开

<a href="http://www.baidu.com"><img src = "img/jaisg.jpg"></a>
使用图片当超链接

• 块标签
  div和span
  span：文本信息在一行展示 行为标签 内联标签
  div：每一个div占一整行 块级标签
• 语义化标签 html5中为了提高程序的可读性

<header></header>
<footer></footer>

• 表格标签
  
  table ：定义表格
  属性：width 宽度； border 边框；
  cellspacing 定义单元格之间的距离，如果为0，则单元格的线会合成1条
  cellpadding 定义内容和单元格的距离
  bgcolor 背景色
  tr：定义行
  td：定义单元格
  th：定义表头单元格
  
  caption：表格标签
  thead：表示表格头
  tbody：表示表格体
  tfoot：表示表格脚
  

合并单元格方式：

<th rowspan = "2">编号</th>  占两行
<th colspan = "2">姓名</th>  占两列