1、web标准的构成: 《结构Structure》(对应html文件)、《表现Presentation》(对应css文件) 和《行为Behavior》(对应js)三个方面

2、骨架标签

<html> //根标签
<head></head> //文档头部
<body></body> //文档主题
</html>

3、编译器自动生成的标签作用
  1)<!DOCTYPE html>: DOCTYPE文档类型标识。 html表示h5类型。

  2)<html lang="en">    lang:当前文档显示的语言。
  3)<meta charset="UTF-8">     charset: 必须设置、 字符集设置、 UTF-8固定格式不可小写

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body> </body>
</html>

学习标签

4、标题标签 <h1> ~ <h6> 从大到小

5、段落标签 <p> 、  换行标签<br />

6、文本格式格式化标签

  

7、布局标签 <div> 和 <span>

  1)<div>标签 用来布局,不加样式独占一行, 类似一个大盒子概念。用来存放其他标签

  2)<span>标签 用来布局, 一行可多个, 小盒子,可以用于段落文字中。突出文字的标识

8、图像标签<img>

  1) src <img>标签的必须属性,用于指定图像文件的路径和名称。

  2)图像标签其他属性: 注意alt: 图片不显示,替换文本。 title: 提示文本

     

9、超链接标签<a></a>

  1) href 必须属性。 target目标窗口弹出方式: _self:是默认值当前页面打开, _blank:是新窗口打开。

  2)冒点链接 <div id='two'> </div>  <a href='#two'>锚点链接</a>

10、注释标签和特殊字符
  1)注释标签: <!--  xxx  -->
  2)特殊字符:

    

11、表格标签<table>: 多用于后台页面展示数据

  1)标签组成: table、thead、tbody、tr、th、td

  2)属性及作用
    

  3)合并单元格 rowspan:跨行、 colspan:跨列。

12、列表标签:   无序标签 (ul)、 有序列表 (ol)、 自定义列表 <dl> <dt> <dd>

  1)列表标签内只能放 <li> 标签

  2)无序列表和有序列表多用在导航栏中
  3)自定义列表: 用户对术语或名词进行解释和描述

   

13、表单标签

  1)表单的组成: 表单域 <form>、表单控件和提示信息。
  2)表单元素: input 、 select 、 textarea。

  3)表单域: 用于收集用户的表单信息和传递。及常用属性

    

  3)表单元素(input)  type 属性与属性值
    

  4)元素定义标注标签(lable)

    a、可以绑定一个表单元素  属性  for = input 的id值  ,点击<lable>光标自动到<input>上。

   5)select下拉表单元素。  <option>    选项标签    option 中如果添加 selected 就是选中状态。

   6)textarea文本域元素。 多用于 留言板和反馈。cols属性: 每行多少个字符、rows多少行。

  

vue学习 第一天 html 基础的更多相关文章

  1. vue学习第一篇 hello world

    计划近期开始学习vue.js.先敲一个hello wolrd作为开始. <!DOCTYPE html> <html lang="en"> <head& ...

  2. Java基础知识二次学习-- 第一章 java基础

    基础知识有时候感觉时间长似乎有点生疏,正好这几天有时间有机会,就决定重新做一轮二次学习,挑重避轻 回过头来重新整理基础知识,能收获到之前不少遗漏的,所以这一次就称作查漏补缺吧!废话不多说,开始! 第一 ...

  3. vue学习第一天 ------ 临时笔记

    学习链接 Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(一)基础知识概述 http://blog.csdn.net/fungleo/article/detai ...

  4. Vue学习第一天:Vue.js指令系统

    1. 如何使用Vue.js? 1.1 直接引入 - <script src="./statics/vue.min.js"></script> - 引入之后在 ...

  5. java 学习第一篇简单基础

    Java基础 Java Java 和C#有着极为相似的语法. 和C#都是面向对象的高级程序语言. JAVA是一个开源,公开的语言,有着极其丰富的开源库和其他资源. JAVA分类 JAVA分SE EE ...

  6. VUE学习第一天,安装

    vue生命周期好文章: http://www.zhimengzhe.com/Javascriptjiaocheng/236707.html

  7. C#学习第一阶段——语法基础

    C#是一门面向对象的编程语言.在面向对象的程序设计方法中,程序由各种相互交互的对象组成.相同种类的对象具有相同的属性,或者说是在相同的class 中的.       例如,以矩形为例,它具有高(len ...

  8. <寒假逆向学习第一天> 破解基础知识之介绍常见工具和壳的特征

    对于我们新手来说,程序是什么语言编写的?程序到底有没有加壳?程序加了什么壳?一直在我们心中充满了疑惑,本文我将根据我的近期学习,总结一下常见的工具和壳的特征. 一:程序是什么语言编译的 从目前接触到程 ...

  9. python学习第一天 计算机基础知识

    目录 什么是编程语言 什么是编程? 为什么要编程? 计算机5大组成分别有什么作用? qq启动的流程? 建议相关学习 课外 什么是编程语言 什么是编程语言? python和中文.英语一样,都是一门语言, ...

  10. linu学习第一天:基础知识

    1 bc 计算器 2 ibase=2 以二进制输入,输出10进制 3 obase=2 输出二进制 4 enable --查看内部命令 5 #第一天的命令 6 enable --查看内部命令 7 ena ...

随机推荐

  1. Hadoop生态元数据管理平台——Atlas2.3.0发布!

    大家好,我是独孤风. 今天我们来聊一下另一个元数据管理平台Apache Atlas.Atlas其实有一些年头了,是在2015年的时候就开源. 相对于Datahub来说,Atlas显得有一些" ...

  2. [WPF]C#调用C++代码(通过C++/CLI)

    用途 通过使用C++ + Opencv 编写算法,然后用WPF(C#)编写程序界面,实现交互 可以参考MSDN文档:https://docs.microsoft.com/en-us/cpp/windo ...

  3. YMOI 2019.6.8

    题解 YMOI 2019.6.8 前言 第二回考试,承让拿了第一次rank1,(●ˇ∀ˇ●) 题解 这次考试总体发挥比较好,每一道题都尽可能得取得了所能及的所有分.虽然多少还是有失误,不过在所难免.保 ...

  4. (19)go-micro微服务filebeat收集日志

    目录 一 Filebeat介绍 二 FileBeat基本组成 三 FileBeat工作原理 四 Filebeat如何记录文件状态: 五 Filebeat如何保证事件至少被输出一次 六 安装Filebe ...

  5. C語言成績分析系統

    C語言成績分析系統,可以實現七個功能.(使用的編譯器是 code::blocks) 主要實現對於學生信息的輸入 顯示輸入學生的信息 根據期末成績來進行排名. 查找某個學生的信息 刪除某個學生的信息 修 ...

  6. angular8表格文件上传并渲染到页面(上传文本与表格,表格有两种写法--之二)

    import { Component, OnInit , ViewChild, OnDestroy, AfterViewInit } from '@angular/core'; import { ST ...

  7. 论文翻译:2022_2022_TEA-PSE 2.0:Sub-Band Network For Real-Time Personalized Speech Enhancement

    论文地址:TEA-PSE 2.0:用于实时个性化语音增强的子带网络 论文代码: 引用: 摘要 个性化语音增强(Personalized speech enhancement,PSE)利用额外的线索,如 ...

  8. Nginx13 openresty使用lua-resty-template

    1 简介 https://github.com/bungle/lua-resty-template 如果学习过JavaEE中的servlet和JSP的话,应该知道JSP模板最终会被翻译成Servlet ...

  9. Vue09 事件

    1 事件语法 Vue 中的事件绑定可以使用 v-on 指令进行处理,可以把 v-on 绑定事件简写为 @. <div id="root"> <button @cl ...

  10. springcloud11 spring cloud config

    1.spring cloud config是什么 官网:https://cloud.spring.io/spring-cloud-static/spring-cloud-config/2.2.1.RE ...