前端学习笔记一一html的常用标签

  • 中国茶
  • 非洲茶
  • 牛奶
  • 2.6 图片标签

    独立标签

    属性:
    src:图片地址: 相对路径 (同一个网站) 绝对路径 (不同网站)
    width:宽度
    height:高度
    border:边框
    align:对齐方式,代表图片与相邻的文本的相当位置(有三个属性值:top middle bottom)
    alt:图片的文字说明
    hspace 和 vspace 设定图片边沿上下左右空白,以免文字或其它图片过于贴近

    2.7 链接标签
    超链接可以是文本,也可以是一幅图像,您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。

    属性:

    href:跳转页面的地址(跳转到外网需要添加协议);
    name:名称,锚点(回到锚点: 顶部,底部,中间),在访问锚点的书写格式:#name的值
    target:_self(自己) _blank(新页面,之前页面存在) _parent _top 默认_self
    _search相等于给页面起一个名字,如果再次打开时,如果页面存在,则不再打开新的页面。可以是任意名字。

    2.8 表格标签
    表格由

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

    2.8.1 普通表格

    (table,tr,td)

    学号姓名
    1aa

    2.8.2 表格的表头

    (th)

    学生表
    学号姓名
    1aa

    2.8.3 表格的列合并

    colspan 属性

    学生表
    学号姓名各科成绩
    1aa8090

    2.8.4 表格的行合并

    rowspan属性

    学生表
    学号姓名语文成绩数学成绩
    1aa8090
    8090

    2.9 文本格式化标签

    定义粗体文本。
    定义大号字。
    定义着重文字。
    定义斜体字。
    定义小号字。
    定义加重语气。
    定义下标字。
    定义上标字。
    定义插入字。
    定义删除字。

    html表单标签

    html表单用于收集不同类型的用户输入

    3.1 form标签

    常用属性:action:表示动作,值为服务器的地址,把表单的数据提交到该地址上处理
    method:请求方式:get 和post
    enctype:表示是表单提交的类型

    get:

    2.不安全
    3.效率高
    4.get请求大小有限制,不同浏览器有不同,但是大约是2KB
    使用情况:一般情况用于查询数据。
    post:
    1.地址栏:请求参数单独处理。
    2.安全可靠
    3.效率低
    4.post请求大小理论上无限。
    使用情况:一般用于插入修改等操作

    3.1.1 input标签

    type: 以下为type可能要取的值:
    1.1 text 文本框 输入内容
    1.2 password 密码框 密文或者掩码
    1.3 radio 表示是单选,name必须一致;value:提交给服务器的数据
    表示同一组中只能选中一个( checked =“checked” 表示选中)
    1.4 checkbox 表示多选 ,name必须一致,
    表示同一组中可以选多个,返回值是个数组( checked =“checked” 表示选中)
    1.5 file :表示上传控件
    以上具有输入性质的必须要有name属性,一开始写value表示是默认值(以后获取输入框的内容要根据name来取)
    以下按钮不具有输入性质,不需要name属性,但是按钮上的文字提示使用value属性
    1.6 submit 提交
    1.7 reset 重置
    1.9 image 图片提交按钮
    以上所有input的属性: width 设置宽度,height 设置高度 border 设置边框
    1.10 button 普通按钮
    1.11 hidden 表示隐藏域,该框的内容服务器需要,但是不想让用户知道(不想清楚的显示在界面上)

    name属性:表单元素名字,只有name属性才能提交给服务器。

    3.1.2 select 元素

    (下拉列表)

    北京 上海 广州 杭州

    3.1.3 textarea元素

    (文本域)

    需要指定输入的区域位置大小

    表示5行100列的区域可以输入内容,该元素没有value属性 3.1.4 示例及效果图如下 ![这里写图片描述](https://img-blog.csdnimg.cn/img_convert/fa5ff3266ba153d7b8cbb7155a430aa7.webp?x-oss-process=image/format,png)

    注册

    用户名:
    密码:
    确认密码:
    性别: 男 女
    爱好: 篮球 足球 乒乓球 羽毛球
    上传头像:
    居住地: 北京 上海 广州 杭州
    个人介绍:

    html框架标签

    通过使用框架,你可以在同一个浏览器窗口中显示不止一个页面。每份HTML文档称为一个框架,并且每个框架都独立于其他的框架。
    使用框架的坏处:
    开发人员必须同时跟踪更多的HTML文档
    很难打印整张页面

    4.1 frameset

    框架结构标签

    框架结构标签()定义如何将窗口分割为框架
    每个 frameset 定义了一系列行或列
    rows/columns 的值规定了每行或每列占据屏幕的面积

    4.2 frame

    框架标签

    frame 标签定义了放置在每个框架中的 HTML 文档。

    4.3 基本的注意事项

    1. 不能将 标签与 标签同时使用
    2. 假如一个框架有可见边框,用户可以拖动边框来改变它的大小。为了避免这种情况发生,可以在 标签中加入:noresize=“noresize”。

    4.4 效果图及源代码示例
    这里写图片描述

    !–主界面–

    !–左侧超链接连接栏–

    第一个连接
    第二个连接
    第三个连接
    第四个连接
    第五个连接

    !–右侧显示页面–

    注册
    用户注册
    用户名:

    最后

    四轮技术面+一轮hr面结束,学习到了不少,面试也是一个学习检测自己的过程,面试前大概复习了 一周的时间,把以前的代码看了一下,字节跳动比较注重算法,面试前刷了下leetcode和剑指offer, 也刷了些在牛客网上的面经。大概就说这些了,写代码去了~

    祝大家都能收获大厂offer~

    篇幅有限,仅展示部分内容


    hr面结束,学习到了不少,面试也是一个学习检测自己的过程,面试前大概复习了 一周的时间,把以前的代码看了一下,字节跳动比较注重算法,面试前刷了下leetcode和剑指offer, 也刷了些在牛客网上的面经。大概就说这些了,写代码去了~

    祝大家都能收获大厂offer~

    篇幅有限,仅展示部分内容

  • 27
    点赞
  • 30
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值