一、参考书籍：

《Web 前端开发 HTML5+CSS3+jQuery+AJAX 从学到用完美实践》

备注：本书为工具书。

二、HTML5元素：

按功能划分：基础、格式、表单、框架、图像、音频/视频、链接、列表、表格、样式/节、元信息、编程。（参考P76）

元素属性：基本属性、语言属性、键盘属性、内容属性、延伸属性等。（参考P82）

三、结构基础：

<!DOCTYPE html>      #<!DOCTYPE>元素定义文档类型为html

<html lang="zh-CN">     #<html>元素定义HTML文档，lang属性定义元素的语言代码或编码

<head>               #<head>元素定义关于文档的信息

    <meta charset="UTF-8">  #<mete>元素定义关于本文档的元信息

    <title> html5文档类型 </title> #<title>元素定义文档的标题

</head>

<body>             #<body>定义文档的主体

</body>

</html>

四、HTML文档规范：

1.所有的元素标签必须小写

2.所有的元素的属性必须用双引号括起来

3.所有元素的标签必须闭合

4.img元素必须要加alt属性(对图片的描述)

五、常用元素：

1.基础元素：

<!DOCTUPE>  定义文档类型

<html>  定义文档

<title>  定义文档标题

<body>   定义文档主体

<h1>、<h2>、<h3>、<h4>、<h5>、<h6>   定义内容标题

<p>  定义段落

<br>   定义简单的换行

<hr>   定义水平线

<!--......-->   定义注释

2.格式元素

<b>    定义粗体文本

<em>   定义强调文本

<font>   定义文本的字体、尺寸、颜色

<i>    定义斜体字

<strong>   定义强调文本

3.样式/节元素:

<div>    定义文档中一块内容，无具体语义

<span>   定义文档内的一行中的一小块内容，无具体语义

4.图像元素：

<img   src="图片位置"   alt="图片描述">

5.列表元素：

第一中情况：

<ol>

    <li>列表文字一</li>

    <li>列表文字二</li>

    <li>列表文字三</li>

</ol>

在网页上生成的列表，每条项目上会按1、2、3编号，有序列表在实际开发中较少使用，显示为：

  1. 列表文字一
  2. 列表文字二
  3. 列表文字三

第二种情况：

<ul>

    <li>列表文字一</li>

    <li>列表文字二</li>

    <li>列表文字三</li>

</ul>

在网页上定义一个无编号的内容列表可以用<ul>、<li>配合使用来实现，显示为：

  • 列表文字一
  • 列表文字二
  • 列表文字三

第三种情况：

<dl>

    <dt>问题一</dt>

    <dd>问题一描述</dd>
    <dt>问题二</dt>

    <dd>问题二描述</dd>
</dl>

在网页上显示为：

问题一

　　问题一描述

问题二

　　问题二描述

6.链接元素：

<a    href="http://news.qq.com/"   title="腾讯新闻">腾讯</a>

title属性为鼠标悬浮时显示的文本

实现页面内滚动跳转：

1.将待跳转到的块添加id属性；

2.<a href="#(块id属性)" >

实现页面内定位到顶部：

<a href="#">

实现点击链接后无操作：

<a href="javascript:;">

六、空格、<、>在网页中显示：

空格：&nbsp;   (带分号的）

<：&lt;

>：&gt;

七、表格元素：

<table>  定义表格

<tr>  定义行

<th>  定义字段名

<td>  定义每一行中的每列

快捷键：  table>(tr>td*3)*6   按tab键   生成6行3列的表

web理论知识--HTML结构及标签的更多相关文章

  1. web理论知识--网页访问过程（附有Django的web项目访问流程）

    当我们闲暇之余想上网看看新闻,或者看个电影,通常的操作是:打开电脑.打开浏览器.输入网址.浏览页面信息.点击自己感兴趣的连接......那么有没有想过,这些网页从哪里来的?过程中计算机又做了什么事情了 ...

  2. Web前端理论知识记录

      Web前端理论知识记录 Elena· 5 个月前 cookies,sessionStorage和localStorage的区别? sessionStorage用于本地存储一个会话(session) ...

  3. Android程序员学WEB前端(1)-HTML(1)-标准结构常用标签-Sublime

    转载请注明出处:http://blog.csdn.net/iwanghang/article/details/76522043觉得博文有用,请点赞,请评论,请关注,谢谢!~ 8月份了,换工作有2个月了 ...

  4. Web基础知识和技术

    WEB是一个外延广泛的概念,不单单指网站,乌徒帮专注拥有WEB界面的网站开发,帮助初学者或已经进入开发的朋友们提供参考讨论平台,然而并不一定能将所有的WEB知识讲全讲透,只是能满足初涉者的建站需求,能 ...

  5. ElasticSearch实战系列四: ElasticSearch理论知识介绍

    前言 在前几篇关于ElasticSearch的文章中,简单的讲了下有关ElasticSearch的一些使用,这篇文章讲一下有关 ElasticSearch的一些理论知识以及自己的一些见解. 虽然本人是 ...

  6. web前端知识体系总结

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

  7. 自己总结的web前端知识体系大全【欢迎补充】

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

  8. web前端知识体系大全

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

  9. web前端知识体系小结（转）

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

随机推荐

  1. centos 7使用docker安装lnmp和redis环境

    #================Docker基础操作========================== #启动docker服务service docker start#搜索可用docker镜像#h ...

  2. 分布式系统登录功能拦截器的实现以及cookie的共享问题（利用cookie实现session在分布式系统的共享）

    当我们的网站采用分布式部署系统时,每个子系统拥有自己独立的session,如果不实现session共享,当用户切换系统访问的时候,会不停的提示登录,这对于用户体验是非常不好的.因此对于多个子系统的的访 ...

  3. dynamic

    dynamic的特性很多,好像和反射也有关,不过这里先介绍一个特性,关于反射的再补充. 我们来看一个方法: public virtual ActionResult Insert(T info) 有一个 ...

  4. Spark记录-源码编译spark2.2.0（结合Hive on Spark/Hive on MR2/Spark on Yarn）

    #spark2.2.0源码编译 #组件:mvn-3.3.9 jdk-1.8 #wget http://mirror.bit.edu.cn/apache/spark/spark-2.2.0/spark- ...

  5. 集成maven和Spring boot的profile功能

    思路:maven支持profile功能,当使用maven profile打包时,可以打包指定目录和指定文件,且可以修改文件中的变量.spring boot也支持profile功能,只要在applica ...

  6. 基于JWT(Json Web Token)的ASP.NET Web API授权方式

    token应用流程 初次登录:用户初次登录,输入用户名密码 密码验证:服务器从数据库取出用户名和密码进行验证 生成JWT:服务器端验证通过,根据从数据库返回的信息,以及预设规则,生成JWT 返还JWT ...

  7. git 学习小记

    话说 git 出了已经很久了,可是我一直没用过.其实也不是没用过,只不过在 github 上下载东西那根本就不是在用 git,只是单纯的HTTP下载而已.我们公司用的是 svn,所以我只会一点点svn ...

  8. [转载]JavaScript 的轻框架开发

    http://www.open-open.com/news/view/1d64fed 为什么我们不用 Angular, Ember 或者 Backbone! Muut 是一个特殊的论坛平台,它也有着巨 ...

  9. 20155338 2016-2017-2 《Java程序设计》第7周学习总结

    20155338 2016-2017-2 <Java程序设计>第7周学习总结 教材学习内容总结 本周学习了第十二章和第十三章的内容,我重点学习了第十三章时间与日期的相关内容. 时间的度量: ...

  10. 从字节码的角度看Java内部类与外部类的互相访问

    Java中non-static内部类为何可以访问外部类的变量?Java中外部类又为何可以访问内部类的private变量?这两个问题困扰过我一段时间,查了一些网上的答案,大多从“闭包”概念入手,理解起来 ...