文档章节

Html之入门

N
 Neil_CN
发布于 2017/08/02 23:42
字数 656
阅读 6
收藏 0

1、网页的构造

    Html文档可以分为三部分:

    第1部分为纯文本,即网页中显示的文本内容。

    第2部分内容为对其他文件的引用,包括图片、视频、音频、脚本文件、样式表,其他Html文档。

    第3部分为标记:类似于<h1></h1>的特殊文本,标记不会显示给用户,只是从语义的角度向浏览器说明被标记包含的内容是什么。

<!DOCTYPE html>
<html>

	<head><meta charset="utf-8" />
		<body>
			<h1>这里是标记<pre>h1</pre>的内容</h1>
		</body>

</html>

效果如下:

特别注意:<h1>标记只是告知浏览器这里是一个段落,而显示出来的效果是由样式控制的,每个浏览器都有自己默认的样式。样式不属于标记的内容

 

2、Html思想

   Html本质上只是一种数据交换格式,标记是从语义上说明Html文档携带的内容是什么。如果从MVC模型的角度来说,Html文档是Model,浏览器扮演Controler和View的角色。

3、Html元素

    个人觉得从数据结构的角度来理解Html文档比较简单,Html文档是一系统Html元素的集合,这些元素以树的形式组织在一起,html元素从有无标签体分为两类。

<h1>这是带标签体的</h1>
<br/>这是不带标签体的

    关于Html元素的属性,本人还没真正理解,希望大神指导,目前个人理解如下:

元素可以带属性也可以不带属性,如<h1 style="color:red;">Hello World</h1>,不带属性的如换行符<hr/>

4、URL

    Url为统一资源定位符,全写为Uniform resource locator 。其格式包含两部分

如http://www.baidu.com,http表示使用的通信协议,:为固定,后面的字符串表示资源地址。

 目前我已知的协议

http://www.baidu.com http协议
ftp://hostname/filename     文件传输协议
mailto:someone@email    邮件协议

文件系统为树形结构,Url也是如此。其中../表示一级目录。

相对定位:指相对于当前页面所在的目录。

绝对定位:需要使用完整的资源定位;绝对定位可以链接到外部资源。

如:当点击“百度”的时候,浏览器将在当前页面打开百度首页

<!DOCTYPE html>
<html>

	<head><meta charset="utf-8" />
		<body>
			<a href="http://www.baidu.com" >百度</a>
		</body>

</html>

根相对定位:使用/表示根目录。

最后还是要有点良心:

参考文档:《HTML5与CSS3基础教程 第8版》

© 著作权归作者所有

N
粉丝 1
博文 8
码字总数 2907
作品 0
成都
私信 提问
《鸡啄米VS2010/MFC编程入门》系列技术文章整理收藏

《鸡啄米VS2010/MFC编程入门》系列技术文章整理收藏 1VS2010/MFC编程入门之前言 http://www.lai18.com/content/410337.html 2VS2010/MFC编程入门之二(利用MFC向导生成单文档应用程序框架) ...

开元中国2015
2015/06/27
267
0
Web前端工程师的成长之路:前端开发零基础入门

HTML5与Flash之争,似乎早早就已分出了胜负,今年7月底,Adobe宣布将于2020年年底停止开发和发行Flash Player,同时建议内容开发者将Flash内容移植到HTML5,等于亲手宣判了Flash死刑。 随着H...

云大学小编
2017/12/04
0
0
Node.js开发入门—使用对话框ngDialog

做网站经常会遇到弹出对话框获取用户输入或弹出对话框让用户确认某个操作之类的情景,有一个基于AngularJS的扩展模块可以帮我们优雅地完成这类事情:ngDialog。 ngDialog在github上提供了一个...

foruok
2015/09/06
0
0
Node.js开发入门—使用AngularJS内置服务

在上一篇,“AngularJS简单示例”中演示了一个非常简单的使用Angular的小demo,那篇已经太长,原本要介绍的一些内容只好单另开篇了。这些内容,就是如何使用Angular服务。 我们还是基于“Ang...

foruok
2015/08/15
0
0
Node.js开发入门—引入UIBootstrap

很多Web管理系统的侧边菜单是可折叠的(手风琴样式),我们在前面两篇文章里的HTML模板,自己用div、css做了一些处理,可效果不好。所以我请来了一个前端UI框架,UI Bootstrap,来帮忙。别看...

foruok
2015/09/02
0
0

没有更多内容

加载失败,请刷新页面

加载更多

数组算法

/*数组的相关的算法操作:1、在数组中找最大值/最小值*/class Test11_FindMax{public static void main(String[] args){int[] array = {4,2,6,8,1};//在数组中找最大...

architect刘源源
47分钟前
2
0
okhttp3 以上版本在安卓9.0无法请求数据的解决方案

应用官方的说明:在 Android 6.0 中,我们取消了对 Apache HTTP 客户端的支持。 从 Android 9 开始,默认情况下该内容库已从 bootclasspath 中移除且不可用于应用。且Android P 限制了明文流量...

chenhongjiang
今天
11
0
简单示例:NodeJs连接mysql数据库

开篇引用网上的说法: 简单的说 Node.js 就是运行在服务端的 JavaScript。Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台。Node.js是一个事件驱动I/O服务端JavaScript环境,基于...

李朝强
今天
8
0
大数据学习路线

年薪30W大数据学习路线图: 一、Hadoop入门,了解什么是Hadoop 1、Hadoop产生背景 2、Hadoop在大数据、云计算中的位置和关系 3、国内外Hadoop应用案例介绍 4、国内Hadoop的就业情况分析及课程...

陈小君
今天
3
0
解读 Kylin 3.0.0 | 更敏捷、更高效的 OLAP 引擎

在近期的 Apache Kylin Meetup 成都站上,我们邀请到 Kyligence 架构师 & Apache Kylin Committer 倪春恩对 Kylin 3.0.0 版本的一些重要功能及改进从使用到原理进行了介绍: Apache Kylin 在...

ApacheKylin
今天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部