HTML笔记

来源：互联网发布：发布订阅模式 java 编辑：程序博客网时间：2024/06/14 09:06

<a> anchor（锚点）元素表示超链接

<a href="网址">这是一个链接</a> （href==hypertext reference）

<a name="tips">基本的注意事项-有用的提示</a>

然后，我们在同一个文档中创建指向该锚的链接：

<a href="#tips">有用的提示</a>

也可以在其他页面中创建指向该锚的链接：

<a href="url#tips">有用的提示</a>

# 符号和锚名称添加到 URL 的末端，就可以直接链接到 tips 这个命名锚了。

<img> 图片元素 <img src="图片地址" width="104" height="142"> <img>是自关闭标签，意思是说，它只包含属性，并且没有闭合标签。

img的src属性用于插入其他页面的图片src中设置图片地址

alt 属性用来为图像定义一串预备的可替换的文本。替换文本属性的值是用户定义的。

@@@@@@@@@在浏览器无法载入图像时，替换文本属性告诉读者她们失去的信息。此时，浏览器将显示这个替代性的文本而不是图像。为页面上的图像都加上替换文本属性是个好习惯，这样有助于更好的显示信息，并且对于那些使用纯文本浏览器的人来说是非常有用的。

align属性可用于设置图像的对齐方式若将其设置为‘left’或‘right’即可达到浮动在左边或右边的效果

width和height结合使用可调整其大小

声明ismap可将图片设置为图像映射

<area>标签应用于图片可设置图片映射，即图片超链接，area中带有href属性可设置映射到那个图像

<body>中的background属性可用于设置背景图片

<p>段落</p> 浏览器会自动地在段落的前后添加空行。（</p>是块级元素）

标签<b> 与<i> 对输出的文本进行格式, 如：粗体 or 斜体这些HTML标签被称为格式化标签。

通常标签 <strong> 替换加粗标签 <b> 来使用, <em> 替换 <i>标签使用。然而，这些标签的含义是不同的：
<b> 与<i> 定义粗体或斜体文本。
<strong> 或者 <em>意味着你要呈现的文本是重要的，所以要突出显示。

<big></big>用于放大字体

<pre></pre>标签中的换行符和空格都将被如实显示

<code>计算机输出</code>
<kbd>键盘输入</kbd>
<tt>打字机文本</tt>
<samp>计算机代码样本</samp>
<var>计算机变量</var>

<address></address>标签用于在HTML文档中显示地址，类似于论文引用

<abbr title=浏览器所显示字符的完整版本>浏览器显示的字符（带有虚下划线）</abbr> 在某些浏览器中，当您把鼠标移至缩略词语上时，title可用于展示表达的完整版本。

<acronym title=浏览器所显示字符的完整版本>浏览器显示的字符</acronym> 仅对于 IE 5 中的 acronym 元素有效。对于 Netscape 6.2 中的 abbr 和 acronym 元素都有效。

<bdo dir="rtl">该段落文字从右到左显示。</bdo>

<q> 表示块引用

<del>blue</del> ~~blue~~

<ins>red</ins> red

<blockquote> 定义长引用

<q> 定义短引用

<cite> 定义作品标题

<dfn> 定义特殊术语或短语

<a href="链接的对象">超链接</a> 超链接可以是一个字，一个词，或者一组词，也可以是一幅图像，当把鼠标指针移动到网页中的某个链接上时，箭头会变为一只小手。

链接属性：

一个未访问过的链接显示为蓝色字体并带有下划线
访问过的链接显示为紫色并带上下划线
点击链接时，链接显示为红色并带上下划线

链接的其他属性还有target 若设置 target=“_blank” 则链接将在一个新的页面中显示

<base href="链接url" target="_blank"> 设置整篇html文档的超链接都是链接到同一个url，并且打开方式都是另开一个新页面。

<head> 元素包含了所有的头部标签元素。在 <head>元素中你可以插入脚本（scripts）, 样式文件（CSS），及各种meta信息。

可以添加在头部区域的元素标签为: <title>, <style>, <meta>, <link>, <script>, <noscript>, and <base>.

开始标签常被称为起始标签（opening tag），结束标签常称为闭合标签（closing tag）。

空元素是在开始标签中关闭的。<br> 就是没有关闭标签的空元素（<br> 标签定义换行）。

<br>换行标签

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

属性是 HTML 元素提供的附加信息。

CSS 可以通过以下方式添加到HTML中:

内联样式- 在HTML元素中使用"style" 属性
内部样式表 -在HTML文档头部 <head> 区域使用<style> 元素来包含CSS
外部引用 - 使用外部 CSS 文件

在标签属性中应用style中 background设置背景色

font-family（字体），color（颜色），和font-size（字体大小）属性来定义字体的样式。

text-align（文字对齐）属性指定文本的水平与垂直对齐方式：

外部样式表

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

内部样式表

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

内联样式

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

<div> 定义文档中的节或域

<span> 定义文档中的行内的小块或区域

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

<basefont> 定义基准字体

<center> 使文本进行水平居中

<table>

表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。

@@@@@@@@@@如果不定义边框属性，表格将不显示边框。有时这很有用，但是大多数时候，我们希望显示边框。

表格的表头使用 <th> 标签进行定义。大多数浏览器会把表头显示为粗体居中的文本

下拉列表

select 选项用option标签

多行文本框(文本域)

<textarea cols="m" rows="n"></textarea>

input标签的三种按钮

<input type="button" value="string"/> 普通按钮 value即显示在按钮上面的字符串

<input type="submit"/>提交按钮

<input type="reset"/> 重置按钮

radio 单选 checkbox 多选

选择器

标签、id、类选择器较为简单，不再赘述

后代选择器空格表示后代关系

交集选择器中间没有任何字符

并集选择器逗号表示并集

通配符 *

儿子选择器 >

序选择器选择器:first-child即选中第一个儿子 .first/last表示第一个或者最后一个

兄弟选择器 h1+div表示选中了紧挨着h1后面的第一个div标签

选择器权重计算方式

在选中的情况下，分别计算id选择器、类选择器、标签选择器的数量

0 0