html入门

 HTML基本格式

1 <html>
2     <head></head>
3     <body>
4         this is my first html.
5     </body>
6 </html>

 常用标签名称与含义

  head标签中的标签:

<!-- 告诉浏览器编码格式的两种方法 -->
<meta charset="utf-8"/>
<meta http-equiv = "content-type" content="text html;charset=utf-8"/>
<meta name="keywords" content = "html,学习,入门"/>  <!-- 给文档添加关键字 -->
<meta name-"description" content = "文档的描述"/><!-- 给文档添加描述信息 -->
<meta name="author" content="张三"/><!-- 给文档添加作者 -->
<meta name="http-equiv="refresh" content="5 url=http://www.baidu.com""> <!-- 网页5秒后自动跳转 -->

 文本标签

  标题标签:h1-h6  文本大小依次减小,文本加黑加粗,自动换行,默认靠左显示

    pre默认格式输出

    属性:align :选择位置center 居中 left 靠左 right k靠右

  水平线标签:hr m默认居中显示

    属性:width="宽度" 设置水平线的宽度
                  size="高度"  设置水平线的高度
                  color="颜色" 设置水平线的颜色

  段落标签:p 将一段数据整体显示,结束自动加换行,与换行符相比间距较大

  换行符:br  告诉浏览器换行位置

  空格 : &nbsp;  空一个字节

  

  权重标记符:

     b:会将内容加黑显示
              i:会将内容斜体显示
              u:会将内容增加下划线
              s或del:增加中划线
                sup:下标显示
                sub:上表显示
                a:增加超链接
          strong:加粗显示
     以上标签不会自动换行,并且可以嵌套使用.

列表标签:
  有序列表:<ul><li>在列标签内书写,数据前默认为黑圈
  无序列表:<ol> <li>数据前默认为1、2、……  type属性改变编码方式
  自定义表:<dl><dd><dt>  dl表示表  dt列的说明  dd 列的数据  自定义标签自定义没有编号

 图片标签:
  img  行内图片,不带自动换行
   属性:
     src 指定照片的路径(绝对路径或相对路径或url)
     height 指定高度  
     width 指定图片宽度
     如果单独设置高度或宽度,则默认等比例放大或缩小
     title:给图片添加标签 ,鼠标放在图片上显示
     alt:图片加载失败时的文字提示

超链接标签:<a>
   属性
     herf:要跳转的网络资源路径
     target:指明网络资源要跳转的位置
       _self:在当前页刷新显示
       _blank:在当前页的标签中显示
       _top:在顶层页面显示
       _parent:在父级页面中显示

  锚点学习
    在文章指定位置添加锚点,格式为:<a name="锚点名字">文本内容</a>
    在文章需要设置跳转的地方添加,格式为:<a herf="锚点名字">要点击的链接名</a>
    一键回到顶部:格式为:<a herf="#">要点击的链接名</a>  重新加载这个网页

 表格标签:table标签代表一个表格
    tr标签代表一行
    td或th标签代表一列,tr和td唯一确定一个表格(th用来设计表格标题加黑加粗显示)
    tr为td的父标签
  属性值:
  border给表格设置边框
  width宽度
  height高度
  作为table标签时,设置表格的属性,作为tr属性时,设置一行的属性,作为td或th属性时为设置表格的高度或宽度
  在使用时,height一般作为tr的属性,width一般只设置第一行表格的属性值,在table中设置时,设置的是表格大小,单个表格大小自动变化,
  colspan水平合并指定数量的单元格
  rowspan垂直合并指定数量的单元格
  被合并的单元格只写第一个

 

posted @ 2019-09-26 19:10  七月流星丶  阅读(137)  评论(0编辑  收藏  举报