从零开始HTML(一 2016/10/17)

 就是准备跟着霹雳猿教程过一遍HTML啦,边看边记录更便于理解记忆吧~

1、属性

HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。属性总是以名称/值对的形式出现,比如:name="value"

属性总是在 HTML 元素的开始标签中规定。

属性例子 1:

<h1> 定义标题的开始。

<h1 align="center"> 拥有关于对齐方式的附加信息。

属性例子 2:

<body> 定义 HTML 文档的主体。

<body bgcolor="yellow"> 拥有关于背景颜色的附加信息。

属性例子 3:

<table> 定义 HTML 表格。

<table border="1"> 拥有关于表格边框的附加信息。

完整的 HTML 参考手册提供了每个 HTML 元素可使用的合法属性的完整列表:

HTML参考手册:http://www.w3school.com.cn/tags/index.asp

2.标题

标题(Heading)是通过 <h1> - <h6> 等标签进行定义的。<h1> 定义最大的标题。<h6> 定义最小的标题。

<hr /> 标签在 HTML 页面中创建水平线。可用于分割元素

3.段落

段落是通过 <p> 标签定义的。

① 使用空的段落标记 <p></p> 去插入一个空行是个坏习惯。用 <br /> 标签代替它。

② 如果希望在不产生一个新段落的情况下进行换行(新行),使用 <br /> 标签

4.样式

style 属性用于改变 HTML 元素的样式。

style 属性的作用是提供了一种改变所有 HTML 元素的样式的通用方法。通过 HTML 样式,能够通过使用 style 属性直接将样式添加到 HTML 元素,或者间接地在独立的样式表中(CSS 文件)进行定义。

background-color 属性为元素定义了背景颜色,如:<body style="

font-family、color 以及 font-size 属性分别定义元素中文本的字体系列、颜色和字体尺寸。

text-align 属性规定了元素中文本的水平对齐方式:<h1 style="text-align:center">This is a heading</h1>,可将center改为left,rght实现不同的效果。

5.引用

① HTML <q> 元素定义短的引用。浏览器通常会为 <q> 元素包围引号

<p>WWF 的目标是:<q>构建人与自然和谐共存的世界。</q></p>

② 用于长引用的 HTML <blockquote>,HTML <blockquote> 元素定义被引用的节。浏览器通常会对 <blockquote> 元素进行缩进处理。

<p>以下内容引用自 WWF 的网站:</p>
<blockquote cite="http://www.worldwildlife.org/who/index.html">
五十年来,WWF 一直致力于保护自然界的未来。
世界领先的环保组织,WWF 工作于 100 个国家,
并得到美国一百二十万会员及全球近五百万会员的支持。
</blockquote>

③ 用于缩略词的 HTML <abbr> HTML <abbr> 元素定义缩写或首字母缩略语。对缩写进行标记能够为浏览器、翻译系统以及搜索引擎提供有用的信息。

6.CSS样式引入方式

有以下三种方式来插入样式表:

① 外部:当样式需要被应用到很多页面的时候,外部样式表将是理想的选择。使用外部样式表,你就可以通过更改一个文件来改变整个站点的外观。

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

② 内部:当单个文件需要特别样式时,就可以使用内部样式表。你可以在 head 部分通过 <style> 标签定义内部样式表。

复制代码
<head>

<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>
复制代码

③ 内联:当特殊的样式需要应用到个别元素时,就可以使用内联样式。 使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。以下实例显示出如何改变段落的颜色和左外边距。

<p style="color: red; margin-left: 20px">
This is a paragraph
</p>

 先写这些,后面待续。。。。

参考网页:

霹雳猿教程_霹雳猿教程-HTML教程-HTML 教程

霹雳猿教程_霹雳猿教程-HTML教程-HTML 简介

霹雳猿教程_霹雳猿教程-HTML教程-HTML 基础

霹雳猿教程_霹雳猿教程-HTML教程-HTML 元素

霹雳猿教程_霹雳猿教程-HTML教程-HTML 属性

霹雳猿教程_霹雳猿教程-HTML教程-HTML 标题

原文地址:https://www.cnblogs.com/qingwengang/p/5970563.html