首页 > 其他分享 >第一天学习 html 基础

第一天学习 html 基础

时间:2022-09-07 12:33:30浏览次数:81  
标签:第一天 标签 元素 表单 学习 html 列表 属性

1、web标准的构成: 《结构Structure》(对应html文件)、《表现Presentation》(对应css文件) 和《行为Behavior》(对应js)三个方面

2、骨架标签

<html> //根标签
   <head></head>  //文档头部
   <body></body>  //文档主题
</html>

3、编译器自动生成的标签作用
  1)<!DOCTYPE html>: DOCTYPE文档类型标识。 html表示h5类型。

  2)<html lang="en">    lang:当前文档显示的语言。
  3)<meta charset="UTF-8">     charset: 必须设置、 字符集设置、 UTF-8固定格式不可小写

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

</body>
</html>

学习标签

4、标题标签 <h1> ~ <h6> 从大到小


5、段落标签 <p> 、  换行标签<br />

 

6、文本格式格式化标签

  

7、布局标签 <div> 和 <span>

  1)<div>标签 用来布局,不加样式独占一行, 类似一个大盒子概念。用来存放其他标签

  2)<span>标签 用来布局, 一行可多个, 小盒子,可以用于段落文字中。突出文字的标识

 

8、图像标签<img>

  1) src <img>标签的必须属性,用于指定图像文件的路径和名称。

  2)图像标签其他属性: 注意alt: 图片不显示,替换文本。 title: 提示文本

     

9、超链接标签<a></a>

  1) href 必须属性。 target目标窗口弹出方式: _self:是默认值当前页面打开, _blank:是新窗口打开。

  2)冒点链接 <div id='two'> </div>  <a href='#two'>锚点链接</a>

 

10、注释标签和特殊字符
  1)注释标签: <!--  xxx  -->
  2)特殊字符:

    

 

 11、表格标签<table>: 多用于后台页面展示数据

  1)标签组成: table、thead、tbody、tr、th、td

  2)属性及作用
    

 

   3)合并单元格 rowspan:跨行、 colspan:跨列。

 

12、列表标签:   无序标签 (ul)、 有序列表 (ol)、 自定义列表 <dl> <dt> <dd>

  1)列表标签内只能放 <li> 标签

  2)无序列表和有序列表多用在导航栏中
  3)自定义列表: 用户对术语或名词进行解释和描述

   

 

13、表单标签

  1)表单的组成: 表单域 <form>、表单控件和提示信息。
  2)表单元素: input 、 select 、 textarea。

  3)表单域: 用于收集用户的表单信息和传递。及常用属性

    

 

   3)表单元素(input)  type 属性与属性值
    

 

   4)元素定义标注标签(lable)

 

     a、可以绑定一个表单元素  属性  for = input 的id值  ,点击<lable>光标自动到<input>上。

   5)select下拉表单元素。  <option>    选项标签    option 中如果添加 selected 就是选中状态。

   6)textarea文本域元素。 多用于 留言板和反馈。cols属性: 每行多少个字符、rows多少行。

  

标签:第一天,标签,元素,表单,学习,html,列表,属性
From: https://www.cnblogs.com/changdasheng/p/16661458.html

相关文章

  • Vben Admin 源码学习:状态管理-角色权限
    前言本文将对Vue-Vben-Admin角色权限的状态管理进行源码解读,耐心读完,相信您一定会有所收获!更多系列文章详见专栏......
  • Salesforce学习收藏贴!一文搞懂Salesforce角色、简档和权限集
     简档、角色和权限集共同决定Salesforce用户可以在Salesforce中查看和执行的操作。【安全和访问】算是Salesforce管理员认证考试中最棘手的模块之一,作为该模块的重要考......
  • HTML页面修改辅助测试页面列表滑轮显示
    需求页面 如上图,我们在实际测试过程中,需要测试这个列表页在数据过多时,是否会有滑轮出现,依照我们常规操作,会需要我们操作业务流程,单条的走【申请】-【审批】等流程,会繁琐......
  • Selenium选择器学习
    Selenium选择器推荐用CSS选择器 Ifyoudon’tcareabouttheorderingofchildelements,youcanuseanattributeselectorinseleniumtochooseelementsbase......
  • vue3源码学习6-计算属性computed
    packages/reactivity/src/computed.tsexportfunctioncomputed<T>(getterOrOptions:ComputedGetter<T>|WritableComputedOptions<T>,debugOptions?:DebuggerOp......
  • Flask 学习-55.文件上传功能开发
    前言文件上传的基本原理实际上很简单,基本上是:一个带有enctype=multipart/form-data的标记,标记中含有一个。应用通过request对象的files字典来访问文件。使......
  • 可容错安全聚合算法学习笔记
    目录参考文献安全聚合流程写在最前:在学习可容错安全聚合算法时,对其中的许多详细步骤不是特别清楚,遂将学习笔记记录下来,以作后期学习。若有不对请及时纠正。参考文献大......
  • 解释 HTML5 中的元字符集
    解释HTML5中的元字符集我确定我是唯一一个不知道UTF8究竟意味着什么的人,我只知道Meta字符集是Meta字符集。所以我做了一些谷歌搜索,我发现,元元素为HTML文档提......
  • 让我们学习,如何使用 python 创建自己的端口扫描器
    让我们学习,如何使用python创建自己的端口扫描器PortScannerPythonPicture本教程仅包含用于创建端口扫描器的四个不同代码片段。这些端口扫描器将为Web服务和外部......
  • 强化学习——价值迭代算法 悬崖漫步为例 C++
    #include<bits/stdc++.h>usingnamespacestd;#defineN100#definecliffcliff_mapintrow,col;structState{intnext_i,next_j,flag;doublereward;......