web前端学习之旅笔记01--HTML

  HTML最容易上手,但也易忘,实际开发中有时需要查阅官方文档,小伙伴们别忘了哟!

  HTML 教程 (w3school.com.cn)

  HTML是网页的骨架负责页面的结构,css负责表现,js负责行为

HTML概述:

  HyperText Mark-up Language 意思是超文本标记语言,超文本指超链接,标记指标签,这个扩展名为.html或.htm的文本文件使用浏览器打开,被浏览器按标签描述渲染成网页,显示的网页可以跳转到对应的网页。

HTML基本结构:

<!-- 文档声明,声明当前网页的版本 -->
<!doctype html>

<!-- html的根标签(元素),网页中的所有内容都要写根元素的里边 -->
<html>

<!-- head是网页的头部,head中的内容不会在网页中直接出现,主要用来帮助浏览器或搜索引擎来解析网页 -->
<head>

<!-- meta标签用来设置网页的元数据,这里meta用来设置网页的字符集,避免乱码问题 -->
<meta charset="utf-8">

<!-- title中的内容会显示在浏览器的标题栏,搜索引擎会主要根据title中的内容来判断网页的主要内容 -->
<title>网页的标题</title>

</head>

<!-- body是html的子元素,表示网页的主体,网页中所有的可见内容都应该写在body里 -->
<body>

<!-- h1网页的一级标题 -->
<h1>网页的大标题</h1>

</body>

</html>

HTML字符实体:
  &nbsp 空格
  &gt 大于
  &lt 小于
  <br/> 换行

HTML标签:
  <div>块标签,无具体语义
  <span>行标签,无具体语义
  带样式标签
    <em>行内元素,表示语气强调词,文字倾斜
    <i>表示专业词汇,文字倾斜
    <b>表示文档中的关键字或者产品名,文字加粗
    <strong>表示非常重要的内容,文字加粗
  语义化标签
    <h1>标题
    <p>段落
    <ul><li>列表 
     
HTML图片
  <img src="相对路径" alt="加载失败显示,盲人读屏文字显示"/>
  ./  当前文件所在目录
  ../  当前文件所在目录的上级目录

HTML链接
  <a>在网页上定义一个链接地址
  href属性:定义跳转地址
  title属性:定义鼠标悬停提示
  target属性:定义链接打开位置
    “_self”:原位置打开
    “_blank”:新开浏览器窗口打开
  <a href="#">跳转到页面顶部<a>

HTML列表  
  在html中也可以创建列表,html列表一共有三种:
  1、有序列表
  2、无序列表
  3、定义列表

  无序列表,使用ol标签来创建无序列表
  使用li表示列表项

  无序列表,使用ul标签来创建无序列表
  使用li表示列表项

  定义列表,使用dl标签来创建一个定义列表
  使用dt来表示定义的内容
  使用dd来对内容进行解释说明

HTML表格
  <table border="1" width="300" hight="100">//列
    <tr>行
      <td></td>//格子
    </tr>
  </table>

HTML布局
  就是排版,传统布局即table布局(EDM邮件),现在流行HTML+css布局
  下一篇做个 个人简历的传统table布局
HTML具体中文文档链接在下面哦!
HTML 教程 (w3school.com.cn)