好程序员 HTML5培训教程-html和css基础知识， Html 是超文本标记语言（英语全称： HyperText Markup Language ，简称： HTML ）是一种用于创建网页的标准标记语言。
Css 是层叠样式表 ( 英文全称： Cascading Style Sheets) 是一种用来 html 和 xml 等文件样式的计算机语言， CSS 不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。

一 . 基础内容：
标记 = 开始标记 + 内容 + 结束标记
标记可以嵌套使用，例如：页面主体标记中含有标题标记，段落标记。
有些标记有属性，具体格式，以 a 标记为例， xxxx 其中 make 为标记的属性。
设计为没有任何内容的元素称为 void 元素，需要使用 void 元素时，只需要使用一个开始标记，这是一种方便的简写，可以减少 html 中的标记数量
二 . 常用标记的使用与意义：
<!doctype html>html5 的文档类型定义，这一行要写到 html 文件开头
<html></html> 标记 html 页面的开始和结束
<head></head> 标记页面的有关信息
<meta charset="utf-8"> 标记指定字符编码，这一行要写到 <head> 元素中所有其他元素上面
<title></title> 为页面指定一个标题，标记中的内容出现在浏览器的顶部
<body></body> 标记页面的主体内容
 中间 xxx 的内容为注释的内容
编写 html 时要把首部和页面主体分开
<h1></h1> 为主标题，从 <h2> 到 <h6> 依次为副标题，字体由大到小
<p></p> 开始一个段落
<blockquote> </blockquote> 标签定义块引用，之间的所有文本都会从常规文本中分离出来，经常会在左、右两边进行缩进（增加外边距），而且有时会使用斜体。也就是说，块引用拥有它们自己的空间

插入一个换行符
<q> 标签定义一个短的引用，浏览器经常会在这种引用的周围插入引号
需要了解的内容（一些老版本弃置的元素与不建议使用的元素，做到看见了要明白其含义）
<ol></ol> 定义一个有序列表
<ul> 标签定义无序列表
<li> 标签定义列表项目， <li> 标签可用在有序列表 (<ol>) 和无序列表 (<ul>) 中
<dl> 标签定义一个描述列表， <dl> 标签与 <dt> （定义项目 / 名字）和 <dd> （描述每一个项目 / 名字）一起使用
标签告诉浏览器把其中的文本表示为强调的内容，对于所有浏览器来说，这意味着要把这段文字用斜体来显示
<body bgcolor="xxx" text="xxxx">,bgcolor 属性设置页面颜色， text 属性设置文本颜色
<font face="arial">xxxx</font> 利用 font 元素改变字体
<center></center> 对其包围的文本进行水平居中处理
一些字符实体
< 显示为 <
> 显示为 >
©right 显示为 ©
三 . 一个简单的 html 框架

<!doctype html>

<html>

<head>

<title> Hello Wrld! </title>

</head>

<body>

<h1> 演示文件，页面显示 hello world ！ </h1>

<p>

Hello Wrld !

</p>

</body>

</html>

四 . 在页面中插入一个链接
用于创建指向其它页面的链接，元素中的内容就是链接文本，在浏览器中链接文本会显示有下划线，指示这是可单击的，例如：
<a href="( 链接目标文件的路径或 url)"
title=" 文本描述 "> （链接文本）
href 属性指向链接文件的路径
rirle 属性所需链接页面的文本描述
加入 id 属性用于具体指向某个链接的某个标题，例如：

<a href = "index.html# 标识符 " > xxxxx </a>

并同步页面中的标题 , 链接所使用的标识符要与标题的标识符设置一致
<h2 id=" 标识符 ">xxxxx</h2>
加入 target 属性，使浏览器打开链接时为单独的窗口，而不是同一窗口，例如：

<a target = "_blank" href = "xxxxxxxx"

title = "xxxxxxxxx" > xxxxxxxxx </a>

如果不加入 target 属性，点击链接时浏览器会在同一窗口打开链接，加入此属性，浏览器会在单独窗口打开链接
五 . 在页面中插入图像
<img src="xxxxx"> 标记为在页面中显示图像， xxx 为图片的路径或 url
alt=“xxx” 属性为描述这个图像内容的文本，如果图像未能显示，就会使用这个文本来取代它。
width-"xxx" 属性告诉浏览器在页面中显示图像的宽度
height="xxx" 属性告诉浏览器在页面中显示图像的高度

未完待续，欢迎继续关注 好程序员 前端教程分享 !

ITPub博客

好程序员HTML5培训教程-html和css基础知识

最新文章