本节列举了一些简单的HTML例子,帮助大家更感性地认识HTML标签。是不是对一些标签还不熟悉?别担心,后面几个章节会有详细说明,先跑几个例子看看效果吧。

HTML文档相关标签
所有HTML文档必须以<!DOCTYPE html>声明开头。

HTML文档则以<html>开头,以</html>结尾。

HTML中所有可见区域都放在<body></body>之间。

HTML文档实例

<!DOCTYPE html>
<html>
<body> <h1>我是标题1</h1>
<p>我是段落</p> </body>
</html>

HTML标题
HTML标题用<h1>到<h6>六个标签表示。

<h1>表示级别最高的标题,<h6>表示级别最低的标题。

HTML标题实例

<h1>我是标题1</h1>
<h2>我是标题2</h2>
<h3>我是标题3</h3>

HTML段落
HTML段落用<p>标签表示。

HTML段落实例

<p>我是段落</p>
<p>我是另一个段落</p>

HTML超链接
HTML中的超链接用<a>标签表示。

HTML超链接实例

<a href="http://www.w3uu.com">去w3悠游学习</a>

上例中href是<a>标签的属性,href属性定义了这个超链接跳转的网址。以后的学习中我们会看到,每个标签都有属性。有了属性,标签的表现会更强大、更丰富。

HTML图片
HTML中的图片用<img>标签表示。

<img>标签有四个重要的属性:src(图片路径)、alt(图片失效时替代的文字)、width(图片宽度)、height(图片高度)。

HTML图片实例

<img src="/static/img/qrcode.jpg" alt="w3uu.com" width="160" height="160">

原文链接: www.w3uu.com/intro/base/html-basic.html

HTML基础实例的更多相关文章

  1. APP接口自动化测试JAVA+TestNG(二)之TestNG简介与基础实例

    前言 继上篇环境篇后,本篇主要对TestNG进行介绍,给出最最基础的两个实例,通过本文后,学会并掌握TestNG测试用例的编写与运行,以及生成美化后的报告.下一篇为HTTP接口实战(国家气象局接口自动 ...

  2. python基础——实例属性和类属性

    python基础——实例属性和类属性 由于Python是动态语言,根据类创建的实例可以任意绑定属性. 给实例绑定属性的方法是通过实例变量,或者通过self变量: class Student(objec ...

  3. Windows 8实例教程系列 - 数据绑定基础实例

    原文:Windows 8实例教程系列 - 数据绑定基础实例 数据绑定是WPF,Silverlight以及Windows Phone应用开发中最为常用的开发技术,在基于XAML的Windows Stor ...

  4. TypeScript进阶开发——ThreeJs基础实例,从入坑到入门

    前言 我们前面使用的是自己编写的ts,以及自己手动引入的jquery,由于第三方库采用的是直接引入js,没有d.ts声明文件,开发起来很累,所以一般情况下我们使用npm引入第三方的库,本文记录使用np ...

  5. javascript订阅模式浅析和基础实例

    前言 最近在开发redux或者vux的时候,状态管理当中的createStore,以及我们在组件中调用的dispatch传递消息给状态管理中心,去处理一些操作的时候,有些类似我们常见到订阅模式 于是写 ...

  6. Java线程基础实例

    概述 Java线程是一个在实战开发中经常使用的基础功能,而在Java中线程相关的类在java.lang和java.util.concurrent里 Thread package thread.base ...

  7. Quartz基础+实例

    1. 介绍 Quartz体系结构: 明白Quartz怎么用,首先要了解Scheduler(调度器).Job(任务)和Trigger(触发器)这3个核心的概念. 1. Job: 是一个接口,只定义一个方 ...

  8. 快速掌握Ajax-Ajax基础实例(Ajax返回Json在Java中的实现)

    (转)实例二:Ajax返回Json在Java中的实现 转自http://www.cnblogs.com/lsnproj/archive/2012/02/09/2341524.html#2995114 ...

  9. Vue.js教程--基础(实例 模版语法template computed, watch v-if, v-show v-for, 一个组件的v-for.)

    官网:https://cn.vuejs.org/v2/guide/index.html Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统. 视频教程:https: ...

  10. android binder 基础实例及解析(一)【转】

    本文转载自:http://blog.csdn.net/newchenxf/article/details/49359283#insertcode 原文网址(转载请注明出处): http://blog. ...

随机推荐

  1. 某虚拟定位APP从破解到原理分析

    工具环境ida7.0iphone 6ios 10.2 0x00:基本情况 1. 该app可以修改模拟手机地理位置(gps.基站.WIFI),拥有全局定位.指定应用定位.模拟扫街等功能,只能在已越狱的I ...

  2. office转换为html在线预览

    /// <summary> /// word 转换为html /// </summary> /// <param name="path">要转换 ...

  3. C#设计模式之代理模式(一)

    原文地址:http://blog.csdn.net/lovelion/article/details/8227953 代理模式是常用的结构型设计模式之一,当无法直接访问某个对象或访问某个对象存在困难时 ...

  4. 再学UML-深入浅出UML类图(二)

    类与类之间的关系(1) 在软件系统中,类并不是孤立存在的,类与类之间存在各种关系,对于不同类型的关系,UML提供了不同的表示方式.       1. 关联关系 关联(Association)关系是类与 ...

  5. php调用含有命名空间的类

    现有a.php 和 b.php在同一个目录下 a.php中 namespace myspace; class A{ __construct(){} .... } b.php中调用类A require_ ...

  6. 在centos7中安装redis,并通过node.js操作redis

    引言 最近在学习node.js 连接redis的模块,所以尝试了一下在虚拟机中安装cent OS7,并安装redis,并使用node.js 操作redis.所以顺便做个笔记. 如有不对的地方,欢迎大家 ...

  7. MHA 一主一从搭建

    安装基本环境介绍 一主一从     MHA manager & slave  node2 192.168.56.27 Master机器 node1 192.168.56.26 VIP   19 ...

  8. 【转】DDMS中线程状态的说明

    因为最近的工作中需要关注APP中的线程,在DDMS中可以查看某个应用的线程: 可以看到每个线程都有自己的status属性,那不同的status分别代表什么情况呢? running – executin ...

  9. POJ 1191 棋盘分割 【DFS记忆化搜索经典】

    题目传送门:http://poj.org/problem?id=1191 棋盘分割 Time Limit: 1000MS   Memory Limit: 10000K Total Submission ...

  10. 2018.9.10 Java语言中的int及char数据类型的长度分别为(32,16 )

    Byte类型 (8) Character类型(16) Integer类型 (32) Double类型 (64) Long类型 (64)