html 学习笔记--基础篇

时间:2022-11-18 08:08:41

  最近被部门经理要求看一下html,重新看发现好多以前看过的只是都忘记了或者以前走马观花看过没有记得住的东西,正好趁此机会在博客上记录一下,顺便的如果以后需要查找,这里有记录的话可能会比上网查快一点(也可能不会),而且多写了一边,印象可以深刻一点。这篇文章紧紧只和我自己用关系,不是很必要的话不建议浪费时间来看它,一下的所有记录点都来之为w3cschool,网址http://www.w3school.com.cn

1.HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。

2.万维网联盟(W3C)在 HTML 4 中推荐使用小写,而在未来 (X)HTML 版本中强制使用小写。

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

万维网联盟在其 HTML 4 推荐标准中推荐小写的属性/属性值。而新版本的 (X)HTML 要求使用小写属性。

4.<hr />分割线

5.<p>、</p>浏览器会自动地在段落的前后添加空行。(<p> 是块级元素)

6.在 XHTML、XML 以及未来的 HTML 版本中,不允许使用没有结束标签(闭合标签)的 HTML 元素。

即使 <br> 在所有浏览器中的显示都没有问题,使用 <br /> 也是更长远的保障。

7.<table>相关:

<th>表头</th>

<caption>标题</caption>

跨两列的表格:

<table border="1">
<tr>
<th>姓名</th>
<th colspan="2">电话</th>
</tr>
<tr>
<td>Bill Gates</td>
<td>555 77 854</td>
<td>555 77 855</td>
</tr>
</table>

夸两列的表格:

<table border="1">
<tr>
<th>姓名</th>
<td>Bill Gates</td>
</tr>
<tr>
<th rowspan="2">电话</th>
<td>555 77 854</td>
</tr>
<tr>
<td>555 77 855</td>
</tr>
</table>

Cell padding 来创建单元格内容与其边框之间的空白。

Cell spacing 增加单元格之间的距离。

8.

<ul>无序列表</ul>  <ol>有序列表</ol>

<ul type="disc"、 type="circle"、 type="square">分别是实心圆、空心圆、正方形的无序列表

<ol type="A" type="a" type="" type="I" type="i">分别以大写字母、小写字母、大写罗马字母、小写罗马字母的有序列表。默认为数字顺序的有序列表。

嵌套列表:

<h4>一个嵌套列表:</h4>
<ul>
<li>咖啡</li>
<li>茶
<ul>
<li>红茶</li>
<li>绿茶</li>
</ul>
</li>
<li>牛奶</li>
</ul>

定义列表:

<dl>
<dt>计算机</dt>
<dd>用来计算的仪器 ... ...</dd>
<dt>显示器</dt>
<dd>以视觉方式显示信息的装置 ... ...</dd>
</dl>

9.

块级元素在浏览器中显示的时候通常会以新的一行来开始或者结束: 如<h>、<p>, <ul>, <table>

内联元素在浏览器中显示的时候通常不以新航开始:如<b>, <td>, <a>, <img>

10.

表格不是布局工具,页面布局不是table的正确用法,table只是用来显示表格化的数据。

11.

复选框默认值: selected="selected";

12.

高大上的带标题的框框:

<form>
<fieldset>
<legend>健康信息</legend>
身高:<input type="text" />
体重:<input type="text" />
</fieldset>
</form>

13.

 <body> 标签中的背景颜色(bgcolor)、背景(background)和文本(text)属性在最新的 HTML 标准(HTML4 和 XHTML)中已被废弃。W3C 在他们的推荐标准中已删除这些属性

14

<base>标签为页面上的所有url设置一个基本的url。当浏览器使用url的时候会先从base标签的获取基本的url来解析相对的url,有效标签包括:<a>、<img>、<link><form>例如:

<base href="http://www.w3school.com.cn/i/" />

<img src-"eg_smile.gif"   />

则实际图片调用的url是http://www.w3school.com.cn/i/eg_smile.gif

另外只要在head中声明了<base target="_blank">所有连接都会在新窗口中打开。

<base>只能在<head>中使用。

15

<link>标签定义文档与外部资源的关系。

<link> 标签最常见的用途是链接样式表,如:

<link rel="strlesheet" type="text/css" href="theme.css" />

<link>是空标签,只有属性,没有值。link只能在<head>标签中使用,但是不限制使用次数。

16

<meta>标签 提供页面相关的元信息,必须在<head>标签内,<meta> 标签的属性定义了与文档相关联的名称/值对,以名称/值的形式被成对传递的。

17.

<noscript> 标签提供无法使用脚本时的替代内容,比方在浏览器禁用脚本时,或浏览器不支持客户端脚本时。

noscript 元素可包含普通 HTML 页面的 body 元素中能够找到的所有元素。

只有在浏览器不支持脚本或者禁用脚本时,才会显示 noscript 元素中的内容。

18.html预留字符

http://www.w3school.com.cn/html/html_entities.asp

19.url

scheme://host.domain:port/path/filename

scheme - 定义因特网服务的类型。最常见的类型是 http

host - 定义域主机(http 的默认主机是 www)

domain - 定义因特网域名,比如 w3school.com.cn

:port - 定义主机上的端口号(http 的默认端口号是 80)

path - 定义服务器上的路径(如果省略,则文档必须位于网站的根目录中)。

filename - 定义文档/资源的名称

编者注:URL 的英文全称是 Uniform Resource Locator,中文也译为“统一资源定位符”。

20

<embed>是HTML5标签,用于定义外部(非HTML)内容的容器,下面的代码片段能够显示嵌入网页中的 MP3 文件:

<embed height="100" width="100" src="song.mp3" />