HTML笔记(2)

1、图像与链接

URL:统一资源定位器,用来标识网络中的任何资源

文本、图片、音视频文件、段落,或其他超文本

即路径,指从当前位置到目标位置所经过的路线

路径在web页面主要有三种形式:

绝对路径:文件从最高级目录下开始的完整路径

  如: E:\LXD_silence\HTML5Basic\Day01\demo01.html

完整的URL组成:协议(http://);主机名或域名(www.baidu.com);                              

                目录路径(img);资源名称:音视频、图片、htmllogo.gif

            如: http://www.baidu.com/img/logo.gif

特点:无论当前资源路径是什么,使用绝对路径总能找到需要的资源。

相对路径:指文件的位置相对于当前文件的位置。它包括目录名,或指向一个可以从当前目录出发找到该 文件的路径。

平级用名字;子级进目录;父级向上返

根相对路径: /image/user.jpg

2、图像元素

使用元素将图像添加到页面;是一个空标记

属性: src:指定显示图像的路径

   width:图像宽度

   height:图像高度

   title:鼠标移动到图片上所显示的文字

   alt:图片不显示的时候的文字

3、链接元素

使用元素创建一个超级链接,语法如下:

文本

属性: href:链接URL

   target:目标,可取值为_blank(新窗口中打开)_self(在自身所在的页面打开网页)

  name:锚点名称

 

链接的各种表现形式:

① 下载资源:”bac.rar”>下载

② 页面跳转:”abc.html”>网页

③ 电子邮件链接:”mailto:[email protected]”>联系我们 

④ 返回页面的空链接:”#”>

⑤ 链接到JavaScript”javascript”>JS

锚点

通过a定义锚点:html中的锚点相当于是html文档中某个位置的记号

定义锚点: ”锚点名(anchorname”>

跳转到锚点:”#锚点名”>

跳转到其他锚点处:”页面的url#锚点名”>


4、表格元素

表格的作用:具备固定格式的信息的布局。

定义表格用 

定义行

定义列

属性

height

align 内容在单元格的水平位置(left/center/right

valign  内容在单元格的垂直位置(top/middle/bottom

属性

width 宽    height 

bgcolor  背景颜色

align 水平位置对齐方式       valign 垂直位置对齐方式

colspan  跨列  

rowspan  跨行

属性

  标题默认将在表格上方居中显示。紧随table标签之后

属性

列标题,与td是平级的(th是表头,默认居中、加粗)

行分组

表头行分组:<thead>thead>

表主体行分组:<tbody>tbody>

表尾行分组:<tfoot>tfoot>

 

5、结构标记

header  文档头部、页头(使用率较高,可以在同一个页面多次使用)

nav  导航   一般用于制作页面中的主导航

section  文档的节;文档的主体内容(使用率高,可多次使用)

aside  独立于主体内容之外的内容。如 边栏、侧导航...

article    文档中引用的一段文字。如文章、帖子、博客....

footer  页脚、文章结尾(使用率较高)

 

6、列表

有序列表:

     

      属性:type: A / a / I / i / 1 定义序列的样式(a/A/I/i/1

      start  定义列表项是从几开始的

      列表项:

    1. 无序列表:

          

          属性:type: disk/circle/square (实心圆、空心圆、方块列表项前的样式

          列表项:

        • 定义列表:

          多数出现在图文混排的样式效果中

                 定义列表

              列表标题(可以插入图像)

             列表内容(做文字描述 )

           

          7、表单

          ①表单标签:
          (不放在form中的数据是提交不到服务器上的)

          属性:action动作(服务器处理数据的程序地址,由服务器端开发人员来提供,默认提交到本页。)

                method  表单将以什么样的方式将数据提交给服务器(是以明文还是密文的方式), 默认值:get

          取值:post 密文的方式发送数据到服务器上,不限制传递数据的长度

                get 明文的方式发送数据到服务器上,限制传递数据的长度2kb

            name  定义表单的名称

            enctype  表单数据的编码方式

          ②表单元素(控件)

          作用:专门接受用户的数据



          1.Input元素

          type:类型

           文本框。接受用户输入的普通数据

           密码框以密文的方式显示数据,密码的录入使用该控件

           复选框。注意:name属性要一致

           提交按钮

          功能:用于提交表单到服务器上

           重置按钮

          作用:将所有的表单元素恢复到默认值状态

          2、textarea多行文本域

          3、selectoption

          4、其他元素

          你可能感兴趣的:(HTML)

      (单元格)

      所有放在table里的内容必须放在td

      属性

      边框属性:border 边框宽度

      bordercolor 边框颜色

      尺寸: width 宽     height 高   (可以是绝对的数值,也可以是百分比)

      背景: bgcolor 背景色     background 背景图

      细节: align  水平对齐方式

      cellspacing  单元格与单元格之间的距离(单元格的外边距)

      cellpadding  单元格内文本与单元格边框的距离(单元格的内边距)

      表格的标题