html新手入门课程 HTML从入门到精通基础篇

html新手入门课程 HTML从入门到精通基础篇(1)

今天开始小编将会给大家讲解HTML的入门知识以及做项目会遇到的某些问题以及如何解决此类问题的方法。说道网页设计,HTML是我们必不可少的一部分。基础网页的构成,无论怎么变幻,都是由原声的HTML代码组成构成网页。

下面我就根据工作中所用和看过的书籍一点一点总结下我们常用的HTML格式和代码。

一、什么是HTML。

HTM不是一段编程语言,而是一款标记语言,本身不能显示在浏览器中。经过浏览器的编释和编译,才能正确反映HTML标记语言的内容。HTML从1.0到5.0经历了巨大的变化,从单一的文本显示功能到多功能互动,已经成为了一款非常成熟的标记语言。

二、HTML文件的基本结构

<!doctype html>

<html>文件开始标记

<head>文件头开始的标记

<meta http-equiv="X-UA-Compatible" content="IE=Edge" charset="utf-8">

<title>XX系统</title>

</head>文件头结束

<body>文件主题的内容

</body>文件主题的结束

</html>文件结束的标记

这里主要说明title和meta(元信息)

<!--说明文件头-->

<title>XX网站</title>

<!--添加作者信息-->

<meta name="author" content="_永不言弃" >

<!--设置网页文字及语言 -->

<meta http-equiv="X-UA-Compatible" content="IE=Edge" charset="utf-8">

<!--设置网页定时(20秒后)跳转-->

<meta http-equiv="refresh" content="20;url=index.html">

三、HTML主要常用标签

3.1标题

<h1></h1>

<h2></h2>

<h3></h3>

<h4></h4>

<h5></h5>

<h6></h6>

3.2 标题字对齐属性align

默认情况下,标题文字是左对齐的。在网页制作过程中,常常需要选择对其他的方式,这时我们就需要用到align属性。

3.3 段落标记p

段落标记是文档中最常见的标记,<p>用来起始的一个段落。

3.3 换行标记

换行标记<br>作用是在不另起一段的情况下将当前文本强制换行。

3.4 不换行标记nobr

<nobor>表示的是不换行的标记</nobor>

3.5 水平线

<hr/>

四、建立超链接

与自身网站页面有关的连接被称为内部连接

4.1绝对路径

绝对路径是包括服务器规范在内的完全路径。绝对路径不管源文件在什么位置都可以非常精确地找到,除非是目标文档的位置发生变化,否则连接不会失效。

4.2相对路径

为了避免绝对路径的缺陷,对于在同一站点之中的连接来说,使用相对路径是一个很好的方法。

4.3 内部连接

<a href="# target="目标窗口的打开方式 " >

属性值

含义

-self 在当前页面中打开连接

-blank 在一个全新的空白窗口中打开连接

-top 在顶层框架中打开连接,也可以理解为在根框架中打开连接

-parent 在当前框架的上一层里打开连接

4.4 锚点连接

锚点到本页面中的位置

<a href="#1" >商品名称</a>

<a href="#2" >产品特点</a>

<a href="#3" >产品规格</a>

<a neme="1">XX商品</a>

<a neme="2">XX产品特点</a>

<a neme="3">XX规格</a>

锚点到其他页面的位置

<a href="index.html#1"></a>对应连接到index.html中name=1的位置

4.5 连接到外部网站

在设置友情链接时,需要打开HTTP协议进行外部连接访问。

<a href="wwww.baidu.com" >百度</a>

4.6 连接到E-mail

<a href="mailto:邮件地址">。。。</a>

4.7 连接到FTP

FTP代表文件传输协议,一个FTP站点通常包含一些上传和下载文件的文件目录。

大部分FTP网站需要使用用户名和密码来登录。

当然还有其他的一些连接方式,例如文件下载,连接到Telnet等。这些都会可以用a标签实现。

HTML基础就先讲到这里,后面退出DIV设计网页格式已经网页分框的实现。

,

免责声明:本文仅代表文章作者的个人观点,与本站无关。其原创性、真实性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容文字的真实性、完整性和原创性本站不作任何保证或承诺,请读者仅作参考,并自行核实相关内容。文章投诉邮箱:anhduc.ph@yahoo.com

    分享
    投诉
    首页