HTML小白学习笔记

欢迎加入Unity业内qq交流群：956187480

qq扫描二维码加群

---

前一段项目内部有个小的web界面需求，奈何项目组没有对位开发人员，后来就找了外面的朋友帮忙写了个界面。后来想着自己学习一下，拓宽一下知识维度，同时为后期打造个人网站 做准备；以下笔记是学习b站千峰教育的视频实时记录的 ，以供后期翻阅

####快捷键
      Shift + end :从头选中一行
      Shift + home：从尾部选中一行
      Shift + alt + ↓：快速复制一行
      alt + ↑或者↓：快速移动一行
      tab：向后缩进
      tab+shift：向前缩进
      Ctrl+/ 注释单行
      Shift+Alt+A 创建注释标签，需选择内容后再按
web三大核心技术
      HTML 结构
      CSS  样式
      JavaScript 行为
1.HTML的基本结构和属性
      Html：超文本 标记 语言
      超文本：文本内容+非文本内容
      标记：也叫做标签，有单标签<>***和双标签的区分<>****,可嵌套
      语言：编程语言
      属性：鼠标放上去以后有个提示如：title = "***"
2.初始代码
      ！+Tab键，快速创建初始化html文件
       文档声明：告诉浏览器这是一个html文件
       html文件的最外层标签：包括这所有的html标签；lang="en"标示为英文网站 zh-CN中文网
       头标签标示网页的头部内容
                   元信息：是编写网页中的赋值信息
                   设置网页标题
      
                  
                  显示网页内容
                  
      
3.标题与段落

      标题为双标签：
 
  ...
； 在一个网页中，h1标签最重要，且一个html文件中只能出现一个h1标签，h5，h6标签在网页中不经常使用
      段落为双标签：


4.文本修饰标签

      文本修饰标签为双标签：，展示效果为加粗
      也表示强调，展示效果与上不同为斜体
      下标上标 ：下标，上标
      删除文本插入文本：  一般都是两者配合使用
5.图片标签与图片属性
        
      img: 图片标签 单标签
      src: 图片地址，分相对路径和绝对路径./表示内部当前路径，../表示父级路径
      alt: 当图片出现问题的时候，显示友好的提示
      title: 提示信息属性 
      width，height：图片的像素大小尺寸，不做设置的话界面加载期间会忽略
6.跳转链接

       双标签
      href属性：链接的地址
      target属性：可以改变链接打开的方式，默认为在当前界面打开
      base 单标签 改变所有链接的默认行为
7.跳转锚点
      a.  HTML
            
HTML超文本标记语言1
    
      设置#标签，设置头id形成对应关系
      b.   HTML
            
      设置#标签，设置name与#标签形成对应关系
8.特殊字符
      <>: <>
      空格： 
      版权：©；
      注册商标：®；
      &：&；
      ¥：&ren；
      摄氏度：°；
9.列表标签
      列表之间可以形成嵌套形成多层列表
      无序列表
      a.无序列表 ，ul  li符合嵌套的规范两者内部不允许存在其他标签
      b.type，改变前面标记的样式有 disc，circle，square等，一般使用css控制



      有序列表
      a.有序列表,ol li符合嵌套的规范两者内部不允许存在其他标签
      b.type，改变前面标记的样式有 a，A，1,i等样式对应数字字母罗马文字

      定义列表:列表项需要添加标题进行描述的内容.
      
 定义列表
      
 定义专业术语或者名词
      
 对名词进行解释和描述.

10.表格标签 属性
      table,表格的最为外层容器
      tr,定义表格行
      th,定义表头
      td,定义表格单元
      caption 定义表格标题
      
      相互之间是有嵌套关系的要符合嵌套规范
      语义化标签：tHead tBody tFoot 对界面没有任何效果影响只是一种写法规范
      在一个table中thead和tfoot只能出现一次
      属性：
      border：表格边框
      cellpadding：单元格内的空间
      cellspacing：单元格之间的空间
      rowspan：合并行
      colspan：合并列
      align：左右对齐格式 left right center
      valign：上下对齐格式 top middle bottom

11.表单标签与属性
      input表单标签：
      
 表单的最外层容器
       单标签 标签用于搜索用户信息，根据不同的type属性展示不同的控件，输入框 密码框 复选框等
      常用type属性：
      text:普通文本输入框
      password：密码输入框
      checkbox：复选框
      radio：单选框
      file：上传文件
      submit：提交按钮
      reset：重置按钮

      textarea：多行文本框
      select option:下拉菜单
      label：辅助标签使控件的触发范围变大 提升我们的用户体验
13.div与span
      div(块)
      全称division，分割分区的意思，
标签用来划分一个区域，相当于一块区域容器，可以容纳段落 标题表格，图像等各种网页元素，html中的大多数标签都可以嵌套在
标签中，div里面还可以嵌套多层div，用来将网页风格成独立的，不同的部分，来实现网页的规划和布局
      span(内联)
      用来修饰文字的，div和span都是没有任何默认样式的，需要配合css才行

---

欢迎加入Unity业内qq交流群：956187480

qq扫描二维码加群