本节列举了一些简单的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. 转:什么是4D(DRG、DLG、DOM、DEM)数据?

    ps:摘抄地址http://blog.163.com/wangqing_rs/blog/static/16451519120111026102916472/  什么是4D(DRG.DLG.DOM.DE ...

  2. 【转】JavaScript 简史

    本文来自众成翻译.JavaScript 毋庸置疑是当今最重要的语言之一.Web 的兴起已经把 JavaScript 带到一个前所未有的地步.下面我们来看看 JavaScript 在其短短历史中是如何演 ...

  3. 狂欢圣诞节,Azure云邀你一起云端跑酷!

    想要速度更快? 希望绕过障碍? 还想安全抵达目的地? …… 平安夜夜游时的各种畅想,不也正是 IT 同事所追求的,更是业务发展的终极目标呀. 好啦,小编说的太多了,这样不好不好.过节休息不谈工作,那就 ...

  4. ZT acct 中文man页面(1)

    acct 中文man页面(1) 2011-08-18 13:57 佚名 博客转载 我要评论(0) 字号:T | T 如果在内核编译时开启了进程记账选项(CONFIG_BSD_PROCESS_ACCT) ...

  5. 插上翅膀,让Excel飞起来——xlwings(一)

    python操作Excel的模块,网上提到的模块大致有:xlwings.xlrd.xlwt.openpyxl.pyxll等,他们提供的功能归纳起来有两种:一.用python读写Excel文件,实际上就 ...

  6. python接口测试-项目实践(六) 实际结果与预期结果对比之 数据源与数据库对比

    六 与数据库对比 import pymssql def compare_expected_vs_db(): diff_list = [] # 存储不一致的代码 with pymssql.connect ...

  7. LeetCodeOJ刷题之15-16【3Sum(三数和问题)】

    本文为两个题:[三数和(3Sum)]与[最近三数和(3Sum Closest)]问题 第一部分分析3Sum问题,第二部分分析3Sum Closest问题,由于两个问题的思路很像,所以这里放到一起分析. ...

  8. bootstrap table 分页只显示分页不显示总页数等数据

    搜了下没找到解决方案,就用CSS来解决了. 把paginationDetailHAlign:"right",使pagination-detail的class为.pull-right ...

  9. POJ-2886 Who Gets the Most Candies?---线段树+约瑟夫环

    题目链接: https://cn.vjudge.net/problem/POJ-2886 题目大意: N个人围成一圈第一个人跳出圈后会告诉你下一个谁跳出来跳出来的人(如果他手上拿的数为正数,从他左边数 ...

  10. n对mod求模整除时转化成mod的数学式

    n对mod求模,它的值在0到mod-1之间,如果要求模整除的时候转化成mod可以用下面的式子: n = (n - 1 % mod + mod) % mod +1 这里先减一,模上mod再加一,这样如果 ...