HTML第三天学习笔记

时间 2019-12-01

标签 html 第三天学习笔记栏目 HTML 繁體版

原文原文链接

　　昨天学的超连接，今天深刻学习了下，发现了更多的知识点，并且关于初始新建网页时，因为是初学者，因此仍是纯手写代码~javascript

 1 <html>
 2 <head>
 3     <title>超连接</title>
 4     <meta http-equiv = "content-type" content = "text/html;charset = utf-8">
 5     <script type = "text/javascript"></script>
 6 </head>
 7 <body>
 8     <h2>绝对地址</h2>
 9     <a href = "http://www.baidu.com" target = "_blank">百度</a><br>
10     <a href = "file:///D:\文档\视频同步\视频同步：做业02.html" target = "_blank">视频同步：做业02</a>
11     <hr>
12     <h2>相对地址</h2>
13     <a href = "视频同步：项目符号.html" target = "_blank">视频同步：项目符号</a>
14     <hr>
15     <h2>特殊连接</h2>
16     <a href = "Images\00.zip">下载图片</a><br>
17     <a href = "mailto:3148113255@qq.com">发送邮件</a><br>
18     <a href = "#" target = "_blank">空连接</a><br>
19     <a href = "javascript:window.close()">关闭窗口</a>
20 </body>
21 </html>

经常使用属性：
href：目标文件地址的URL，该URL是相对地址，也能够是绝对地址；
target：目标文件的显示窗口
  _blank:在新窗口中打开目标文件
  _self:在当前窗口打开目标文件，至关替换；
  _parent:在父级窗口中打开目标文件；
  _top:在最顶级窗口打开目标文件；
其中_parent和_top经常使用于框架网页中
name:定义锚点连接的名称;html

绝对地址URL：
  一、远程的绝对地址
   访问远程的文件，老是以域名、主机名开头。
  二、本地的绝对地址
   访问本地的绝对地址，是以“file:///”开头的绝对地址。java

相对地址URL：
  一、当前文件和目标文件是同级文件；
   连接地址直接写目标文件名；
  二、当前文件与目标文件所在的文件夹同级；
   先找文件夹名，再找文件名；
  三、目标文件位于上一层目录中；
   上一级文件使用"../"表示
   上两级文件使用"../../"表示
   以此类推;浏览器

特殊连接：
一、下载连接：网页不能直接打开的文件会提示下载;
二、邮箱连接：
  mailto:(邮箱地址)
三、普通空连接：
四、js连接
  在连接地址中写#号；
  在火狐window.colse()用不了时使用以下代码；
  <a href = "javascript:window.open('about:blank','_self').close()">关闭窗口</a>
  或输入地址 about:config 而后再输入关键字 close_window 修改其布尔值;服务器

============================================================================框架

第二个是关于锚点连接：学习

 1 <html>
 2 <head>
 3     <title>视频同步：锚点连接</title>
 4     <meta http-equiv = "content-type" content = "text/html;charset = utf-8">
 5     <script type = "text/javascript"></script>
 6 </head>
 7 <body>
 8     <h4>界面的跳转</h4>
 9     <ul>
10         <li><a href = "视频同步：做业02.html#this">跳转界面</a></li>
11     </ul>
12 </body>
13 </html>

锚点连接：
含义：在一个网业的不一样区域进行跳转。锚点定义为“定义记号”；
定义锚点：<a name = "锚点名称"></a>
  锚点名称的命名规则：能够包含字母、数字、下划线，但只能以字母开头。
  注意：<a>和</a>之间没有内容，换句话说，这个记号不是给咱们看的，而是给连接看的。
  例如： <a name = "Top_2"></a>
跳转到锚点：
  语法： <a href = "文件名#锚点名称">内容</a>
  文件名：无关紧要，若是是同一网页的不一样部分跳转，不用文件名，有则反之；
  注意：<a>和</a>之间要有内容，不然会没法进行跳转。ui

========================================================================================this

第三个知识点是关于meta标记url

1 <html>
2 <head>
3     <title>meta标记</title>
4     <meta http-equiv = "content-type" content = "text/html" charset = "uft-8">
5 </head>
6 <body>
7     
8 </body>
9 </html>

meta的主要做用：
是提供网页的元信息。好比：指定网页的搜索关键字；
<meta>有两个属性：一个是http-equiv和name
一、http-equiv属性
  功能：模拟http协议文件头信息，当信息从服务器端传到客户端时，告诉浏览器如何正确的显示网页内容。
  http-equiv属性通常要与content属性配合使用。Content属性指定信息的详细参数。
  (1)、设置网页的字符集；
  <meta = http-equiv = "content-type" content = "text/html" charset = "uft-8">
  (2)、网页自动刷新;
  <meta = http-equiv = "refresh" content = "2">//每隔两秒钟刷新网页一次；
  <meta = http-equiv = "refresh" contrnt = "2" url = "http://www.baidu.com">每隔两秒跳一次到百度。
二、name属性
  name属性主要用于设置网页的搜索关键字、版权信息、做者等
  (1)、设置网页关键字搜索；
  <meta name = "keywords" content = "关键字">
  (2)、设置网页描述信息
  <meta name = "description"> content = "描述">

===================================================================================

第四个知识点是表格的制做

 1 <html>
 2 <head>
 3     <title>Border</title>
 4     <meta http-equiv = "content-type" content = "text/html; charset = tuf-8">
 5 <head>
 6 <body>
 7     <table border = "1" width = "500">
 8         <tr>
 9             <td>&nbsp</td>
10             <td>&nbsp</td>
11             <td>&nbsp</td>
12         </tr>
13         <tr>
14             <td>&nbsp</td>
15             <td>&nbsp</td>
16             <td>&nbsp</td>
17         </tr>
18     </table>
19 </body>
20 </html>

<table>属性
width:表格宽度，单位能够是百分比也能够是固定值。
heigth:表格高度
align：表格水平对齐方式，取值：left、center、right
border:边框粗细
bordercolor:边框颜色
bgcolor:表格背景颜色
background:背景图片URL
cellpadding:单元格边线到内容间的距离(填充距离)
cellspacing:单元格与单元格之间的距离(间距)
rules:合并单元格边框线，取值:all
注意：rules兼容性很差，请用CSS取代；

<tr>属性——行标记
bgcolor:行的背景色
height:行的高度
align:行的文本水平居中
valign:垂直居中，取值：top,middle,bottom

<td>是普通单元格<th>是标题单元格，居中加粗显示