HTML入门学习笔记(二)

今天主要学习的是关于HTML中的列表和表格以及form标签的知识,最后进行一个小练习。

首先我们先来认识和了解一下学习的内容:

一、列表

1无序列表.

无序列表是一个项目的列表,此列项目使用粗体圆点(典型的小黑圆圈)进行标记。

无序列表始于

    标签。每个列表项始于
  • 软件编程语言

    • Java
    • C++
    • Python
    • JavaScript

    2.有序列表

    同样,有序列表也是一列项目,列表项目使用数字进行标记。

    有序列表始于

      标签。每个列表项始于
    1. 标签。

      搜索引擎排名

      1. Google
      2. Baidu
      3. Bing
      4. Sogou

      3.自定义列表

      健康食品

      水果
      苹果
      香蕉
      蔬菜
      西兰花
      菠菜

      效果:

      HTML入门学习笔记(二)_第1张图片

      二、表格

      表格由

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

      表格和边框属性

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

      表格的表头

      表格的表头使用

      标签进行定义。大多数浏览器会把表头显示为粗体居中的文本:

      在一些例子中会出现空白的单元格,可以在内容里加入空格占位符来便于我们观察。

      表格的合并

      colspan=“”这个是表格的列合并

      rowspan=""这个是表格的行合并,

      在一些例子的实例中往往需要我们进行一些单元格的合并才能达到我们预期的效果。

      排名 关键词 趋势 今日搜索 最近七日 相关链接
      1 鬼吹灯 356 3560 贴吧 图片 百科 

      在例子中我们为了是表格好看一些,尝试了用style="border-collapse: collapse;"来将表格的boder看起来更美观一些,为表格设置合并边框模型。

      效果:

      HTML入门学习笔记(二)_第2张图片

      三、form标签

      定义和用法

      标签用于为用户输入创建 HTML 表单。

      表单能够包含 input 元素,比如文本字段、复选框、单选框、提交按钮等等。

      表单还可以包含 menus、textarea、fieldset、legend 和 label 元素。

      表单用于向服务器传输数据。

      本次我们主要用到form表单中的input元素,通过设置type属性来达到我们想要的效果,其中input的以下等:

      1.文本域通过 标签来设定,当用户要在表单中键入字母、数字等内容时,就会用到文本域。

      2.密码字段通过标签 来定义:注意:密码字段字符不会明文显示,而是以星号或圆点替代。

      3. 标签定义了表单单选框选项

      4. 定义了复选框. 用户需要从若干给定的选择中选取一个或若干选项。

      5. 定义了提交按钮.当用户单击确认按钮时,表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。

      6.提供了一个文件目录输入的平台,选择上传文件,参数有name,size。

      以上是我在练习中用到的一些属性,其他还有很多,暂时没有列出来。

      个人简历

      姓名 性别 出生年月
      民族 政治面貌 身高
      学制 学历 户籍
      专业 毕业学校
      技能、特长或爱好
      外语等级 计算机
      个人履历
      时间 单位 经历
      联系方式
      通信地址 联系电话
      E-mail 邮编
      自我评价

      效果:

      HTML入门学习笔记(二)_第3张图片

      今天的学习收获就到这里了,明天也是上课发懵的一天。

       

       

      你可能感兴趣的:(HTML入门学习笔记(二))