之前对HTML的理解：HTML主要是标签组成，一对标签组成一个位置，在响应的位置内填写对应的内容。

1.编译工具

  • [ ] HTML需要编译工具？txt文档改后缀双击运行。
  • [ ] 了解前端了一下前端，然后发现自己之前用的工具IDEA就可以，写Java，Python，现在还能写前端，美滋滋。。。

2.HTML是什么

  • [ ] 官方名字：超文本标记语言（HyperText Mark-up Language ），超文本：带有超链接的文本，标记：使用标签在网页上标记资源的位置
  • [ ] 作用：用来设计网页的标记语言
  • [ ] 文件后缀 .html或 .htm为后缀
  • [ ] 执行方式：由浏览器解释执行
  • [ ] 经验：
  •   不区分大小写，建议小写
    

  •   标签是成对出现的（大部分）
    

  •   通过标签来标记数据，不同的数据使用不同的标签
    

HTML示例

HTML中代码的注释：<!--注释内容-->

<!DOCTYPE html>

<html lang="en"><!--HTML的开始-->

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

</body>

</html>

HTML标签

上面代码中的：

<html></html>

<head></head>

<title></title>

<body></body>
  • [ ] HTML用于描述功能的符号成为“标签”
  • [ ] 标签都封装在一对尖括号“<...>”之中,如就是一个标签
  • [ ] 封闭类型标记（也叫双标记），必须成对出现,如
  • [ ] 非封闭类型标记，也叫作空标记，或者单标记，如

HTML元素

指的是从开始标签（start tag）到结束标签（end tag）的所有代码

<title>Title</title><!--Title-->
  • [ ] HTML 元素以开始标签起始
  • [ ] HTML 元素以结束标签终止
  • [ ] 元素的内容是开始标签与结束标签之间的内容
  • [ ] 某些 HTML 元素具有空内容（empty content）
  • [ ] 空元素在开始标签中进行关闭（以开始标签的结束而结束）
  • [ ] 大多数 HTML 元素可拥有属性

HTML属性与值

<html lang="en"><!--lang是HTML的属性，en是lang属性的值-->

</html>
  • [ ] 1.属性是用来修饰元素的

    • 属性必须位于开始标签里
    • 一个元素的属性可能不止一个，多个属性之间用空格隔开
    • 多个属性之间不区分先后顺序
  • [ ] 2.每个属性都有值
    • 属性和属性的值之间用等号链接
    • 属性的值包含在引号当中
    • 属性总是以名称/值对的形式出现

常用标签

<p></p><!--段落标签-->

<h1></h1><!--段落标签（h1表示第一段落  一般是h1到h6）-->

</br><!--换行标签-->

<hr/><!--水平线标签-->

<span></span><!--无语义标签-->

<img></img>

    1.使用<img>元素将图像添加到页面

    2.必须属性：src（存储图像的位置）

    3.常用属性：width，height，alt，title

    <img src="URL" width="300" alt=”替换文本属性”/>

    title定义了鼠标经过图片时显示的内容，搜索引擎抓取图片时，是根据title定义的内容来分析图片是什么的

    alt当图片未能正常显示时，用于给用户的提示信息

HTML简单介绍（个人角度）的更多相关文章

  1. Android开发自学笔记(Android Studio)—4.界面编程与View组件简单介绍

    一.引言 Android应用开发最重要的一份内容就是界面的开发,无论你程序包含的内容多么优秀,如若没有一个良好的用户交互界面,最终也只是会被用户所遗弃.Android SDK提供了大量功能丰富的UI组 ...

  2. UML动态模型图简单介绍

    UML动态模型图描述了系统动态行为的各个方面,包括用例图.序列图.协作图.活动图和状态图.下面就每种图做一个简单介绍: 用例图 用例图描述系统外部的执行者与系统提供的用例之间的某种联系.所谓用例是指对 ...

  3. 【美妙的Python之中的一个】Python简单介绍及环境搭建

    美妙的Python之Python简单介绍及安装         简而言之: Python 是能你无限惊喜的语言,与众不同.             1.Python:                  ...

  4. JSF简单介绍

    JSF简单介绍 一. 什么是 JSF: JavaServer Faces (JSF) 是一种用于构建 Web 应用程序的新标准 Java 框架.它提供了一种以组件为中心来开发 Java Web 用户界 ...

  5. 简单介绍Struts2

    Struts2概述 Struts2虽然是Struts1的基础上发展起来的,但是实质上是以WebWork框架为核心,为传统的Struts1注入了WebWork的设计理念,统一了Struts1和WebWo ...

  6. 服务器端IO模型的简单介绍及实现

    https://mp.weixin.qq.com/s?src=3&timestamp=1541726441&ver=1&signature=xPSye3v7miF7aVeLHb ...

  7. 《HTML 5网页开发实例具体解释》样章、内容简单介绍、前言

    http://spu.jd.com/1167757597.html http://product.dangdang.com/23484942.html 样章 http://download.csdn. ...

  8. JVM内存各个区域分工简单介绍

    JVM内存各个区域简单介绍: 程序计数器:程序计数器是一块较小的内存空间,它可以看作是当前线程所执行的字节码的行号指示器. 在使用多线程时,为了线程切换后能恢复到正确的执行位置,每条线程都需要有个独立 ...

  9. Hibernate学习（1）简单介绍

    1.什么是Hibernate?           首先,Hibernate是数据持久层的一个轻量级框架.数据持久层的框架有非常多比方:iBATIS,myBatis,Nhibernate,Siena等 ...

  10. 基于SIP和RTP协议的开源VOIP之QuteCom简单介绍

    **************************************************************************************************** ...

随机推荐

  1. 编程语言类别；运行Python程序的方式；变量和常量；Python程序的垃圾回收机制；

    目录 编程语言分类 运行Python程序的两种方式 1.交互式 变量与常量 1.变量 2.常量 3.小整数池 垃圾回收机制 编程语言分类 编程语言分为: 1.机器语言:直接用二进制的0和1和计算机(C ...

  2. 【Layui】当Layui数据表格和Layui下拉框组合时发生的问题

    关于Layui数据表格用下拉框显示问题 如图所示 可以看见当点击下拉框时下拉选项被下拉框覆盖 此时你需要在数据表格渲染完成时的回调内添加如下代码即可 $(".sel_scrq"). ...

  3. yiele函数

    1.概念: 当调用Thread.yield()函数时,会给线程调度器一个当前线程愿意让出CPU使用的暗示,但是线程调度器可能会忽略这个暗示. 2.实战. 看下面例子 public class yiel ...

  4. Spring MVC 的 multipartResolver 不能同iWebOffice2006 共同使用

    转:http://jamesby.iteye.com/blog/57381 项目使用iWebOffice2006,本来可以正常使用,但是系统有文件上传需求,故定义了一个multipartResolve ...

  5. HDU 6444 Neko's loop ( 2018 CCPC 网络赛 && 裴蜀定理 && 线段树 )

    题目链接 题意 : 给出一个 n 个元素的环.可以任意选择起点.选完起点后.可以行走 m 步.每次前进 k 个单位.所走到的点将产生正或负贡献.问你一开始得准备多少才能使得初始资金加上在环上获取最大利 ...

  6. Tarjan 【整理】

    Tarjan [整理] #include<bits/stdc++.h> using namespace std; class FastIO{ /* copyright (c) dgklr ...

  7. 彩色图像--色彩空间 CIELAB、CIELUV

    学习DIP第65天 转载请标明本文出处:http://blog.csdn.net/tonyshengtan ,出于尊重文章作者的劳动,转载请标明出处!文章代码已托管,欢迎共同开发:https://gi ...

  8. 不错的图表库：ChartDirector

    官网:http://www.advsofteng.com 1)for c++ 2)for .NET 3)for Java 4)for ASP/COM/VB 5)for PHP 6)for Python ...

  9. Postman(二)、调试模式

    postman提供了一个调试模式,很方便我们写脚本以及断言 在脚本中用console.log()打印,到控制台查看 比如写入如下脚本: 点击Send后,在控制台可以看到如下信息

  10. jQuery实现表单动态添加与删除数据操作示例

    <!DOCTYPE html> <html lang="en"> <head>   <meta charset="UTF-8&q ...