当前位置: 首页 > news >正文

Web前端开发——HTML快速入门

  • HTML:控制网页的结构
  • CSS:控制网页的表现

一、什么是HTML、CSS

(1)HTML

(HyperText Markup Languaqe:超文本标记语言)

  • 超文本:超越了文本的限制,比普通文本更强大。除了文字信息,还可以定义图片、音频、视频、超链接等内容(如基于Windows所操作的记事本所编写的一类文本称为普通文本)
  • 标记语言:由标签构成的语言
  1. HTML标签都是预定义好的。例如:使用<a>展示超链接,用<img>展示图片,<video>展示视频。
  2. HTML代码直接在浏览器中运行,HTML标签由浏览器解析。

所以学习HTML,主要学习它里面常用的标签。

(2)CSS
  • CSS(Cascading Style Sheet):层叠样式表,用于控制页面的样式(表现)

所以学习CSS,主要学习它里面定义的常用的样式。

(3)前端学习(HTML、CSS、JS)的官方文档

w3school 在线教程icon-default.png?t=N7T8https://www.w3school.com.cn/

二、HTML快速入门

(1)简单操作
  • 新建一个文本文件,并把文件后缀名改成:".html" 。
  • 编写HTML结构标签——>例如一旦见到<html> ... </html>标签,浏览器解析就知道要以HTML的格式来解析。
  • <html>标签中写一个<head>标签和一个<body>标签。在<head>当中,定义一个<title>标签去定义一个HTML文件的标题,而在<body>当中编写HTML文件当中的页面内容。

在我们的操作系统当中,如果是".html"后缀的文件,默认是会被浏览器识别的

(2)简单入门代码(用记事本编写)
  • <img src=""/> (自闭合)也可以写出 <img src=""></img>
<html><head><title>HTML 快速入门</title></head><body><h1>Hello World!</h1><img src="666.jpg"/></body>
</html>

(3)注意事项
  • HTML当中的标签是不区分大小写的。(一般使用小写)<html> 写成 <HtmL> 一样的可以得到运行效果。
  • HTML标签的属性值单双引号都可以。在HTML标签的属性时,例如"src"属性,可以接单引号也可以接双引号。
  • HTML的语法比较松散。指的是HTML的语法并不严格。
(4)HTML结构标签

相关文章:

Web前端开发——HTML快速入门

HTML&#xff1a;控制网页的结构CSS&#xff1a;控制网页的表现 一、什么是HTML、CSS &#xff08;1&#xff09;HTML &#xff08;HyperText Markup Languaqe&#xff1a;超文本标记语言&#xff09; 超文本&#xff1a;超越了文本的限制&#xff0c;比普通文本更强大。除了…...

浅谈http协议及常见的面试题

1、浅谈http协议 HTTP&#xff08;Hypertext Transfer Protocol&#xff09;超文本传输协议&#xff0c;是互联网上应用最为广泛的一种网络协议&#xff0c;所有的WWW文件都必须遵守这个标准。它是基于TCP/IP通信协议来传递数据&#xff08;HTML文件、图片文件、查询结果等&am…...

LabVIEW自动探头外观检测

开发了一套基于LabVIEW的软件系统&#xff0c;结合视觉检测技术&#xff0c;实现探头及连接器外观的自动检测。通过使用高分辨率工业相机、光源和机械手臂&#xff0c;系统能够自动定位并检测探头表面的细微缺陷&#xff0c;如划痕、残胶、异色、杂物等。系统支持多种探头形态&…...

搏击与防卫笔记

文章目录 降龙十八掌 咏春个人防身笔记防卫直拳应对耳光防卫摆拳坐马冲拳 本来想以武术为标题的&#xff0c;想了想武术这个标题太大太深&#xff0c;自己连一知半解都算不上&#xff0c;就谢为搏击与防卫吧。 每个男孩都有个武侠梦&#xff0c;独步江湖&#xff0c;仗剑走天涯…...

泰国内部安全行动司令部数据泄露

BreachForums 论坛的一名成员宣布发生一起重大数据泄露事件&#xff0c;涉及泰国内部安全行动司令部 (ISOC)&#xff0c;该机构被称为泰国皇家武装部队的政治部门。 目前&#xff0c;我们无法准确确认此次泄露的真实性&#xff0c;因为该组织尚未在其网站上发布有关该事件的任…...

MATLAB算法实战应用案例精讲-【数模应用】分层聚类(附MATLAB、python和R语言代码实现)

目录 前言 几个高频面试题目 什么情况下选择分层聚类,什么情况下选择K-mean聚类呢?两种模型的好坏如何比较? 算法原理 SPSSAU 案例分析 SPSSPRO 1、作用 2、输入输出描述 3、案例示例 4、案例数据 5、案例操作 6、输出结果分析 7、注意事项 8、模型理论 分层…...

九、函数的声明和定义

函数声明&#xff1a; 1. 告诉编译器有一个函数叫什么&#xff0c;参数是什么&#xff0c;返回类型是什么。但是具体是不是存在&#xff0c;函数 声明决定不了。 2. 函数的声明一般出现在函数的使用之前。要满足先声明后使用。 3. 函数的声明一般要放在头文件中的。 定义的函…...

简洁纯文字类的Typecho主题wenso

主题介绍 文章说说类博客网站源码&#xff0c;页面清新简洁。适合文章说说美文博客网站建站使用&#xff0c;响应式手机版本。 本来是dedecms的模板&#xff0c;也比较简单&#xff0c;适合用来搭建一个文学类的&#xff0c;纯文字的网站&#xff0c;简单的改成了typecho&…...

安卓请求服务器[根据服务器的内容来更新spinner]

根据服务器的内容来更新spinner 本文内容请结合如下两篇文章一起看: 腾讯云函数node.js返回自动带反斜杠 腾讯云函数部署环境[使用函数URL] 现在有这样一个需求,APP有一个下拉选择框作为版本选择,因为改个管脚就变成一个版本,客户需求也很零散,所以后期会大量增加版本,这时候每…...

c++ 联合(Union)的特性和使用

联合&#xff08;Union&#xff09;是一种特殊的数据结构&#xff0c;允许在同一内存位置存储不同的数据类型。一个 union 可以有多个数据成员&#xff0c;但是在任意时刻只有一个数据成员可以有值。当某个成员被赋值后其他成员变为未定义状态。以下是联合的主要特点和使用方式…...

大白菜U盘启动工具

大白菜如何u盘启动进winpe装系统大白菜是一款非常实用的U盘启动盘制作工具&#xff0c;可以帮助用户快速地将U盘制作成启动盘&#xff0c;从而方便地进行系统安装、维护和修复等操作。官方网站&#xff1a; 大白菜u盘启动盘制作工具_大白菜u盘装系统_大白菜pe_大白菜官网-首页…...

C# 中 IEnumerable 和 IQueryable 接口之间的区别

在 C# 中&#xff0c;IEnumerable和IQueryable接口都用于查询数据集合&#xff0c;但它们的用途不同&#xff0c;功能也不同。下面是它们之间差异的细分&#xff1a; 1. C# 中的 IEnumerable 接口 在命名空间中定义System.Collections。表示集合中元素的只进式游标。适用于查…...

centos安装yum命令及常用yum命令

一、准备工作 获取安装介质&#xff1a; 如果你有CentOS的安装ISO文件或DVD介质&#xff0c;可以直接使用它来设置本地yum源。 如果没有&#xff0c;你需要在一个有网络连接的CentOS系统上下载所需的rpm包和依赖。 创建挂载点&#xff08;如果你使用的是ISO文件&#xff09;&a…...

table = collections.defaultdict(list)申请的字典的类型是什么?

当你使用 collections.defaultdict(list) 来申请一个字典时&#xff0c;这个字典的类型是 defaultdict&#xff0c;但是其行为和表现方式在某些方面与普通的字典&#xff08;dict&#xff09;相似&#xff0c;主要区别在于它如何处理缺失的键。 defaultdict 是 Python 标准库 …...

【虚拟机】虚拟机网络无法访问问题【已解决】

【虚拟机】虚拟机无法上网问题【已解决】 问题探究解决方法法1&#xff1a;查看相关“网络服务”是否处于正常启动状态法2&#xff1a;重启网络法3&#xff1a;重新安装VMWare法4&#xff1a;使用NAT模式&#xff0c;每次打开win7都没连上网的解决办法 问题探究 安装了很多个虚…...

大数据面试题之Spark(3)

目录 Spark的哪些算子会有shuffle过程? Spark有了RDD&#xff0c;为什么还要有Dataform和DataSet? Spark的RDD、DataFrame、DataSet、DataStream区别? Spark的Job、Stage、Task分别介绍下&#xff0c;如何划分? Application、job、Stage、task之间的关系 Stage内部逻辑…...

基于 Gunicorn + Flask + Docker 的模型高并发部署

在现代 Web 应用程序中&#xff0c;处理高并发请求是一个常见且重要的需求。本文将介绍如何使用 Gunicorn、Flask 和 Docker 来实现模型的高并发部署。我们将从环境设置、代码实现、Docker 镜像构建及部署等方面进行详细讲解。 一、环境设置 1. 安装 Flask 首先&#xff0c;…...

CPU通过网络将IP camera的RTSP流(H.264编码或是H.265编码)拉回, 交给GPU解码并显示的处理流程

这个流程涉及到从IP摄像头获取视频流&#xff08;通过RTSP协议&#xff09;&#xff0c;然后将流传输给GPU进行解码和显示的过程。详细的流程描述如下&#xff1a; 1. 获取视频流: - **IP摄像头**: 摄像头通过RTSP&#xff08;Real-Time Streaming Protocol&#xff09;将…...

windows@资源管理器中的地址栏@访问共享文件夹的各种方法@管理共享文件夹

文章目录 资源管理器中的地址栏可以访问什么访问共享文件夹&#x1f47a;UNC路径资源管理器打开共享文件夹纯命令行方式访问共享文件夹 共享文件夹相关操作查看所有已经共享的文件夹&#x1f47a;停止某个文件的共享 共享文件夹的访问控制补充匿名访问问题&#x1f60a;强制启用…...

ffmpeg推流时Unknown encoder ‘libx264‘

如果环境中有conda&#xff0c;最简单的办法就是 conda uninstall ffmpeg conda install ffmpeg 或者 sudo apt-get install -y libgmp3-dev pkg-config gnutls-bin libaom-dev libass-dev libbluray-dev libfdk-aac-dev libmp3lame-dev libopencore-amrnb-dev libopencore-…...

xmind导入导出支持图片功能源码改造

xmind导入导出支持图片功能 在开发用例管理平台的过程中&#xff0c;需要使用xmind来管理用例。所以也涉及到xmind用例的导入导出功能&#xff0c; 在开始的时候&#xff0c;xmind文件中没有图片&#xff0c;所以使用xmind,xmindparser包就可以完成改任务。现在新增需求&#x…...

Web应用防火墙用在哪些场景?

WAF是Web Application Firewall的缩写&#xff0c;翻译为“Web应用防火墙”是一种网络安全设备或服务&#xff0c;用于保护Web应用程序免受各种网络攻击和漏洞的影响。 WAF特别设计用于识别和阻止特定于Web应用程序的攻击&#xff0c;例如SQL注入、跨站脚本(XSS)、跨站请求伪造…...

MySQL高可用(MHA高可用)

什么是 MHA MHA&#xff08;MasterHigh Availability&#xff09;是一套优秀的MySQL高可用环境下故障切换和主从复制的软件。 MHA 的出现就是解决MySQL 单点的问题。 MySQL故障切换过程中&#xff0c;MHA能做到0-30秒内自动完成故障切换操作。 MHA能在故障切换的过程中最大…...

k8s_如何配置 containerd 使用镜像加速拉取docker.io上的镜像

在 Kubernetes 使用 containerd 作为容器运行时,可以通过配置 containerd 来使用镜像网站(镜像仓库)拉取镜像。这可以通过修改 containerd 的配置文件来实现。以下是详细步骤: 步骤 1:安装 containerd (如果已安装,这一步略过) 如果尚未安装 containerd,可以使用以下命…...

centos7安装宝塔面板

一、进入root模式 sudo su二、安装宝塔面板 if [ -f /usr/bin/curl ];then curl -sSO https://download.bt.cn/install/install_panel.sh;else wget -O install_panel.sh https://download.bt.cn/install/install_panel.sh;fi;bash install_panel.sh ed8484bec...

Spring 事务管理:全面解析

Spring 框架是一款广受欢迎的 Java 开发框架&#xff0c;其强大的功能之一便是事务管理。事务管理在确保数据一致性和完整性方面至关重要。在这篇文章中&#xff0c;我们将深入探讨 Spring 事务管理&#xff0c;包括声明式事务管理、编程式事务管理&#xff0c;以及事务传播和隔…...

概率论与数理统计_上_科学出版社

contents 前言第1章 事件与概率1.1 随机事件与样本空间1.1.1 样本空间1.1.2 随机事件1.1.3 事件之间的关系与运算 1.2 概率的三种定义及其性质1.2.1 概率的统计定义1.2.2 概率的古典定义1.2.3 概率的几何定义1.2.4 概率的性质 1.3 常用概型公式1.3.1 条件概率计算公式1.3.2 乘法…...

昇思25天学习打卡营第11天|LSTM+CRF序列标注

序列标注指给定输入序列&#xff0c;给序列中每个Token进行标注标签的过程。序列标注问题通常用于从文本中进行信息抽取&#xff0c;包括分词(Word Segmentation)、词性标注(Position Tagging)、命名实体识别(Named Entity Recognition, NER)等。 和人理解语言一样&#xff0c…...

CSS 核心知识点 - grid

思维导图 参考网址: https://developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_grid_layout 一、什么是 grid&#xff1f; CSS Grid布局是在CSS3规范中引入的一种新的布局方式&#xff0c;旨在解决传统布局方法&#xff08;如浮动、定位、表格布局&#xff09;存在的许多问题。C…...

pyecharts可视化案例大全(1~10)

pyecharts可视化案例大全 一、堆叠柱状图二、关闭坐标轴显示三、自定义坐标轴标签文本四、更改坐标轴数据类型五、双Y轴【直方图&折线图】六、直方图——双Y轴七、折线图——双X轴八、图例选择设置单选九、缩略轴——inside组件十、缩略轴——slider组件一、堆叠柱状图 不…...