HTML第一次作业

2023-10-29

什么是web前端?

web前端就是由多种技术制作的,用来给用户展示的网页,也叫网站的前台部分

包括的技术有html、css、javascript、jQueery、bt等

什么是HTML?

hyper text maekuo language

(骨骼)是一个超文本标记语言,标记也可以称作标签或元素,是目前使用最广泛之一,也是最重要的之一。

是一个描述性文本,不是编程语言(编程语言要编译)浏览器通过这个描述文本渲染和呈现网页。

之所以称为超文本语言是因为它拥有所谓的超级链接和媒体文件

可以展示文字、表格、声音、图像、动画等

发展历程

html雏形

html2.0

html规范协议

html4.01标准指定

xhtml

xhtml 2.0 (抛弃市场)

html 5.0----至今

特点

简单灵活

可扩展性强,标签语言

平台无关性,不同系统兼容

环境部署

运行环境有浏览器就行

开发环境包括记事本、sublime、pycharm等

本节课学习的标签

标签

基本信息

标签有开始和结束标签,之间的区域称作区域

标签有属性,属性有值

标签大小写都能识别

布尔型标签,写了就自带效果,不写就不会产生效果

行内标签,就是只修饰被包裹的内容,不能直接支持宽高属性

块标签,就是至少占满一行,同时可以直接支持宽高属性。

标签可以无线内嵌

常见标签

head 这个标签一般写浏览器所需的信息,

meta

charset = [“编码”] 指定编码,例如”utf-8”。常用的字符集有 gbk(简体中文)、BIG5(繁体中文)、utf-8(通用)、gb2312、name 描述、content 内容

body这个标签写的内容

<font size=""> 字体的大小

<b> bold 加粗,指定加粗的地方

<strong> 也是加粗,强调语气的地方

<i> italic 斜体

<em> 也是斜体 ,强调语气

<del> 删除线

<u> underline,下划线

换行,卸载行尾就行 ,只写一个

1 <p> 段落标签,上下都会空一行

1<pre> 在<pre>内写成什么样呈现出来就是什么样

<span> 行内标签

1<div> 块标签,通常用于布局使用

<sub> 下标标签

<sup> 上标标签

1<hr> 分割线

这样改宽度

1<h1> 大标题

1<h2> 比h1小一号...一直到h6,字号依次递减

语义化标签

这些都是语义化标签,

布局上跟div功能一样,但在爬虫搜索的时候,更容易找

可读性强,方便维护,对爬虫有指导性

大部分网站都是采取三段式,www.taobao.com很典型

多媒体标签

图片视频音频都是多媒体标签

常用图片的格式:

bmp是windows专有的图片格式,本身不进行压缩,清晰度略低于png, 占据的空间较大,所以处于淘汰中

png无损压缩的格式,支持背景透明,清晰度最高,但比jpg内存占用多

jpg 是有损压缩,不支持背景透明,清晰度略差于png,但内存占用小

gif是动图,支持背景透明,但支持256色

img标签 是image的缩写,代表图片的含义

src 资源路径,填写一个路径

路径填写方式:1.绝对路径 2.相对路径 3. ../式路径访问方式

alt 当图片无法正常显示,alt的内容就会被引用

title 悬停在图片上后显示的内容

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

HTML第一次作业 的相关文章

  • JSP通用分页

    通用分页核心思路 将上一次查询请求再发一次 只不过页码变了 实现步骤 1 先查询全部数据 baseDao
  • 前端学习之常见标签的使用(2)

    目录 h标签 p标签 br标签 字符实体 img标签 a标签 mailto链接 base标签 锚点 div span video H5新增 audio H5新增 h标签 h标签 标题标签 在HTML中 一共有六级标题标签 h1 h6 在显示
  • navigator.mediaDevices.getUserMedia()出现NotReadableError Could not start audio source错误的解决办法

    问题是 支持了navigator mediaDevices getUserMedia 的方法 但没有权限去调起麦克风导致的问题 解决方案 手动到手机 设置 隐私 授权录音或者麦克风对该app的使用权限
  • innerHTML与XSS攻击

    HTML5为所有元素提供了一个innerHTML属性 既能获取对象的内容又能向对象插入内容 属性值 HTML标签 文本 浏览器会将属性值解析为相应的DOM树 HTML解析器在浏览器中是底层代码比JavaScript方法快很多 同时意味着替换
  • css改变svg颜色_如何使用CSS混合模式和SVG动态更改产品图像的颜色

    css改变svg颜色 To better explain that title right off the bat here s what we re about to learn and it s easier than you thin
  • 滑动指示器导航源码html+css

  • 看天气WeatherCan V1.0 ---气象数据分析系统web版

    版权声明 本文为CSDN博主 老郭1 的原创文章 遵循CC 4 0 BY SA版权协议 转载请附上原文出处链接及本声明 原文链接 https blog csdn net HZGJF article details 104772394 Wea
  • 【H5】 svg动画 旋转属性与虚线属性

    svg 动画 旋转 transform rotate angle x y 不要写在style里面 angle 旋转角度 x y旋转中心 绘制虚线 stroke dasharray a b a b c d 旋转属性 transform rot
  • 动态一键换肤实现思路和demo

    前言 浏览器切换样式无非是通过css 总共有以下三种方法 内联style 注入style 注入link 那么我们想要实现一键换肤 那么我们为了剥离干净dom和css 我们只能选择style和link这两种方法 核心思路 在html的head
  • HTML表格

    目录 实例 表格 表格和边框属性 表格的表头 表格中的空单元格 更多实例 表格标签 一个完整的实例 本例涉及到的资源 eg background jpg eg cute gif 可以使用 HTML 创建表格 实例 表格 这个例子演示如何在
  • 前端基础之ES6

    1 前后端对比 2 ES6 ECMAScript6 0 以下简称ES6 ECMAScript是一种由Ecma国际通过ECMA 262标准化的脚本 是JavaScript语言的下一代标准 2015年6月正式发布 从ES6开始的版本号采用年号
  • CSS 浏览器缩小之后页面错乱 块不见问题

    问题1 浏览器正常100 显示的时候 今日推荐是看得见的 浏览器缩小 小于100 之后 今日推荐被挤不见了 今日推荐块的DIV的CSS原配置是 today recommend py container width 1200px margin
  • 如何给证件照换一个背景颜色

    我们在考试报名的时候 经常是不同的考试需要不同的登记照尺寸和背景颜色 但是我们基本上不可能每种颜色的证件照都去拍一张吧 那样也太麻烦成本也太高 所以通过前端实现了一个改变证件照背景颜色的方法 他可以将证件照的背景颜色修改为任意的颜色 而不局
  • angular:路径找不到时会跳回主页

    本地起服时 如果输入的路径无法匹配现有规则 则会跳转至主页 带来一定困扰 最好是统一显示或者导航至特定页面 以便debug const routes Routes path component PageNotFoundComponent
  • div标签的contenteditable属性实现input效果以及控制input的聚焦失焦

    在触屏 移动端网页 中 聊天室类型的输入框很常见 但是很多都是自定义样式的 直接改造input标签会很麻烦 给div标签设置contenteditable属性可以达到input标签的效果还能轻松的自定义样式 利用input事件和v text
  • HTML+CSS3 5个炫酷的loading

    为了方便大家方便CV 每个loading对应一个html文件 文件下载压缩包 下载地址 https download csdn net download m0 48850204 20432352 spm 1001 2014 3001 550
  • 12.HTML5下一代的HTML标准介绍与初识尝试

    关注回复 学习交流群 加入 安全开发运维 答疑交流群 请朋友们 多多点击文中的广告 支持作者更新更多文章 目录 本文为作者原创文章 为尊重作者劳动成果禁止非授权转载 若需转载请在 全栈工程师修炼指南 公众号留言 或者发送邮件到 master
  • 表格嵌套与合并

  • flex布局详解

    声明 本人的所有博客皆为个人笔记 作为个人知识索引使用 因此在叙述上存在逻辑不通顺 跨度大等问题 希望理解 分享出来仅供大家学习翻阅 若有错误希望指出 感谢 flex基本概念 任何一个容器都可以指定为Flex布局 例如 box displa
  • localStorage和sessionStorage和Cookie的区别

    localStorage和sessionStorage和Cookie是前端开发中三种常见的临时存储客户端会话信息或者数据的方法 它们都存储在客户端中 区别 一 三者存储的有效时期不同 1 Cookie存储的有效时期可以设置 一般在浏览器关闭

随机推荐

  • 串行测试 并行测试_什么是并行测试,为什么要采用它?

    串行测试 并行测试 随着技术的进步 随着组织从手动测试转向Selenium测试自动化 测试解决方案变得比以往更具可扩展性 但是 大多数组织仍在努力的领域之一是可并行运行多个测试的可伸缩性 许多公司仍在使用顺序测试方法来提供质量保证 这会浪费
  • 大学生团体天梯赛(第六届)

    题目地址 天梯赛 include
  • 深度学习8

    Generative Adversarial Network 正如我们前面所说的 GAN里面有两个重要的东西 其中一个就是Generator Generator可以是一个NN 它的输入是一个vector 它的输出是一个更高维的vector
  • JSP-javabean技术

  • ELK 4.5——加入机器学习

    如果你也是 Elaticsearch 的粉丝 或者机器学习的爱好者 你肯定不会错过这个东西 5 月份 Elaticsearch 推出了新版本 5 4 准确地说是 Elastic Stack 全家桶都更新为 5 4 了 在 X pack 中的
  • Angular input延迟防抖debounceTime

    import Component OnInit from angular core import AbstractControl FormBuilder FormGroup Validators from angular forms imp
  • 【代码复现】NER之GlobalPointer解析

    前言 在NER任务中 主要分为三类实体 嵌套实体 非嵌套实体 不连续实体 今天分享方法以end to end的方式解决前两个问题 GlbalPointer 它利用全局归一化的思路来进行命名实体识别 NER 可以无差别地识别嵌套实体和非嵌套实
  • Mysql事务---MVCC详解

    Mysql数据库事务隔离级别 SQL 标准定义了四个隔离级别 READ UNCOMMITTED 读取未提交 事务的修改 即使没有提交 对其他事务也都是可见的 事务能够读取未提交的数据 这种情况称为脏读 READ COMMITTED 读取已提
  • Jetpack学习-1-Lifecycle+Activity源码分析

    解耦是软件开发亘古不变的追求 而Lifecycle正是这一名言的体现 Android开发过程中 有些功能不可避免与页面的生命周期关联 LifeCycle作为Jetpack中具有生命周期感知姓的组件 通过感知activity fragment
  • CVE-2022-22963:Spring Cloud Function SpEL 远程代码执行漏洞

    读者需知 本文仅供学习使用 由于传播和利用此文所造成的损失均由使用者本人负责 文章作者不为此承担责任 简介 SpringCloud Function作为SpringCloud家族成员最早在2017年提出 旨在为快速发展的Serverless
  • 以太坊开发文档09 - javascriptApi

    Web3 JavaScript appAPI 为了让您的应用程序能够在以太坊上工作 您可以使用web3 js库web3提供的对象 在底层 它通过RPC调用与本地节点通信 web3 js与任何暴露RPC层的以太坊节点一起工作 web3包含et
  • Vue3 isProxy

    isProxy 检查一个对象是否是由 reactive 或者 readonly 方法创建的代理 实例
  • [计算机毕业设计]深度学习的图标型验证码识别系统

    前言 大四是整个大学期间最忙碌的时光 一边要忙着准备考研 考公 考教资或者实习为毕业后面临的就业升学做准备 一边要为毕业设计耗费大量精力 近几年各个学校要求的毕设项目越来越难 有不少课题是研究生级别难度的 对本科同学来说是充满挑战 为帮助大
  • OpenGL ES 3.0 开发(一)

    什么是 OpenGLES OpenGLES 全称 OpenGL for Embedded Systems 是三维图形应用程序接口 OpenGL 的子集 本质上是一个跨编程语言 跨平台的编程接口规范 主要应用于嵌入式设备 如手机 平板等 由科
  • SpringBoot websocket + java swing 实现大文件上传与下载

    使用场景 无法直接登录服务器上传文件 使用web端上传超大文件出现超时 实现原理 上传 server端与client端建立websocket连接 client将待传文件进行分块 然后将文件的相关信息 文件名 md5值 分块大小 总块数 当前
  • 角谱衍射计算

    角谱衍射 角谱衍射计算 D F F T D FFT D FFT 即采用两次傅里叶变换 原始公式和 S
  • IP协议相关技术

    前言 其实我们在上网的时候并不是直接使用IP地址 同样IP地址还不方便记忆 这样我们就需要IP相关的技术来帮助我们通信 DNS 一开始人们使用TCP IP世界中的主机识别码来转换成具体的IP地址 这样人们就可以直接使用主机名称 但是随着网络
  • Chatglm2-6b模型相关问题

    Chatglm2 6b模型相关问题 1 Chatglm2 6b模型p tuning后推理答非所问 2 ChatGLM2 6b ptuning 3 ChatGLM2 6b部署 1 Chatglm2 6b模型p tuning后推理答非所问 据C
  • python词云 小说《庆余年》

    一 概述 使用jieba分词和wordcloud生产 小说的词云库 源码地址 https github com jw star pythonDemo tree master E5 BA 86 E4 BD 99 E5 B9 B4wordclo
  • HTML第一次作业

    什么是web前端 web前端就是由多种技术制作的 用来给用户展示的网页 也叫网站的前台部分 包括的技术有html css javascript jQueery bt等 什么是HTML hyper text maekuo language 骨