前端3剑客(第1篇)-初识HTML

100编程书屋_孔夫子旧书网

当今主流的技术中,可以分为前端和后端两个门类。

前端:简单的理解就是和用户打交道

后端:主要用于组织数据

而前端就Web开发方向来说, 分为三门语言, HTML、CSS、JavaScript

语言作用
HTML描述页面的结构,类似于动物的骨架
CSS渲染技术,使得页面更好看,也可以一定程度的让页面动起来
JavaScript实现和后端的交互, 数据验证、收发等功能

HTML的结构

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body></body>
</html>

上面面的一段代码既表示一段HTML的结构, 它表示生成了一个空白的HTML网页

组成HTML的元素称为标签,标签的结构分为两种

  • 有开始标签和结束标签的 如
  • 有单标签的 ,例如 ,单标签中的 / 即表示标签的闭合, / 符号不写也是可以的

下面这段HTML代码包含的标签解释如下

  • 声明类型, 意思为超文本语言类型。 是一种HTML5的规范写法,在HTML发展过程中还有以下的几种声明方式
    <!DOCTYPE html> html5规范, html的第一行必须为此值<!--html4 严格版-->
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd"><!--html4 过渡版-->
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
    <!--html4 框架版-->
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN""http://www.w3.org/TR/html4/frameset.dtd">关于html4的声明类型,可以参考:
    https://www.w3.org/TR/html4/sgml/dtd.html
    
  • html 最外层的一个跟节点,里面的所有元素都是它的子元素

    <!--lang属性表示使用英文,如果是中文,可以改成zh, 非严格属性也可以不写-->
    <html lang="en"></html>
    
  • head  头标记,整个网页的全局属性都会写在这个里面

  • body 网页的主体部分,用户可以直观感受到的显示内容的部分

  • meta 标签, 标记原数据,可以规定网页的字符、缩放比例等信息

    
    <!--规定字符集使用UTF-8, UTF-8 涵盖全球所有的国际和民族的文字和大量图像, UTF-8 规定一个字符占3个字节-->
    <meta charset="UTF-8">
    
  • title 标题标签,标题的内容会在浏览器的tab页中显示

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/338150.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

《已解决》F12显示已在程序中暂停

首先打开F12-->源代码 最后一步&#xff1a;

【linux】宝塔,首页挂载磁盘,显示使用情况

挂载前&#xff1a; 挂载后&#xff1a; 数据无价&#xff0c;建议&#xff1a;备份需要挂载的磁盘&#xff0c;或者使用新磁盘来进行操作。 1、下载自动挂载磁盘的脚本&#xff1a; wget -O auto_disk.sh http://download.bt.cn/tools/auto_disk.sh 2、给脚本添加执行权限&a…

IP 分片过程及偏移量计算

IP 报头中与分片相关的三个字段 1、 标识符&#xff08; ldentifier )&#xff1a;16 bit 该字段与 Flags 和 Fragment Offest 字段联合使用&#xff0c; 对较大的上层数据包进行分段&#xff08; fragment &#xff09; 操作。 路由器将一个包拆分后&#xff0c;所有拆分开的…

【linux】docker安装下载器:aria2、gopeed、thunder迅雷

一、aria2 1、下载aria2服务镜像 docker pull p3terx/aria2-pro 2、下载ariang页面服务 docker pull p3terx/ariang 3、启动aria2服务 docker run -d --name aria2 \ --restart unless-stopped \ --log-opt max-size1m \ -e PUID$UID \ -e PGID$GID \ -e UMASK_SET022 \ -…

MQTT之使用mosquitto

1、下载并安装mosquitto 参考&#xff1a;04 Windows下mosquitto安装_mosquitto-1.6.9-install-windows-x64 windowsserver系-CSDN博客 2、启动 2.1添加用户 .\mosquitto_passwd -c pwfile.example user1 报错信息如下&#xff1a; Error: Unable to open file C:\Program…

【SQL学习进阶】从入门到高级应用(一)

文章目录 ✨MySQL命令行基本命令✨数据库表的概述✨初始化测试数据✨熟悉测试数据 &#x1f308;你好呀&#xff01;我是 山顶风景独好 &#x1f495;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01; &#x1f495;希望您在这里可以感受到一份轻松愉快的氛围…

共计3万字!从零开始创建一个小规模的稳定扩散模型!

节前&#xff0c;我们星球组织了一场算法岗技术&面试讨论会&#xff0c;邀请了一些互联网大厂朋友、参加社招和校招面试的同学。 针对算法岗技术趋势、大模型落地项目经验分享、新手如何入门算法岗、该如何准备、面试常考点分享等热门话题进行了深入的讨论。 合集&#x…

stack学习

std::stack 类是一种容器适配器&#xff0c;它给予程序员栈的功能——特别是 FILO&#xff08;先进后出&#xff09;数据结构。该类模板用处为底层容器的包装器——只提供特定函数集合。栈从被称作栈顶的容器尾部推弹元素。 operator 赋值给容器适配器 (公开成员函数) 元素访问…

JCR一区级 | Matlab实现TCN-BiGRU-MATT时间卷积双向门控循环单元多特征分类预测

JCR一区级 | Matlab实现TCN-BiGRU-MATT时间卷积双向门控循环单元多特征分类预测 目录 JCR一区级 | Matlab实现TCN-BiGRU-MATT时间卷积双向门控循环单元多特征分类预测分类效果基本介绍程序设计参考资料 分类效果 基本介绍 1.Matlab实现TCN-BiGRU-MATT时间卷积双向门控循环单元多…

【设计模式深度剖析】【7】【结构型】【享元模式】| 以高脚杯重复使用、GUI中的按钮为例说明,并对比Java类库设计加深理解

&#x1f448;️上一篇:外观模式 | 下一篇:结构型设计模式对比&#x1f449;️ 设计模式-专栏&#x1f448;️ 目录 享元模式定义英文原话直译如何理解&#xff1f;字面理解例子&#xff1a;高脚杯的重复使用例子&#xff1a;GUI中的按钮传统方式使用享元模式 4个角色1. …

【TB作品】MSP430G2553单片机,智能储物柜

智能储物柜将实现的功能&#xff1a; 1在超市或者机场场景下&#xff0c;用户需要进行物品暂存时。按下储物柜键盘的需求按键&#xff0c;智能储物柜将会随机为用户分配一个还没使用的柜子&#xff0c;屏幕提示用户选择密码存储方式或者身份证存储方式&#xff1b; 2 用户选择密…

教你搞一个比较简单的计时和进度条装饰器

教你搞一个比较简单的计时和进度条装饰器 什么是装饰器为啥要用装饰器呢&#xff1f;上代码&#xff01;如何使用装饰器效果 什么是装饰器 装饰器的英文是&#xff1a;Decorator。装修的英文是&#xff1a;Decoration。顾名思义就是我们要用装饰器在函数func()上搞点儿事儿&am…

纯Java实现Google地图的KMZ和KML文件的解析

目录 前言 一、关于KMZ和KML 1、KMZ是什么 2、KML是什么 二、Java解析实例 1、POM.xml引用 2、KML 基类定义 3、空间对象的定义 4、Kml解析工具类 三、KML文件的解析 1、KML解析测试 2、KMZ解析测试 四、总结 前言 今天是六.一儿童节&#xff0c;在这里祝各位大朋友…

oracle mysql索引区别

文章目录 1.引言1.1 索引的基本概念1.2 Oracle和MySQL的简介 2.Oracle索引2.1 Oracle索引的类型**B-Tree索引****Bitmap索引****Function-Based索引****Partitioned索引****Text索引** 2.2 Oracle索引的工作原理2.3 Oracle索引的实例代码 3.MySQL索引3.1 MySQL索引的类型**B-Tr…

synchronized 锁的到底是什么?

通过8种情况演示锁运行案例&#xff0c;看看我们到底锁的是什么 1锁相关的8种案例演示code package com.bilibili.juc.lock;import java.util.concurrent.TimeUnit;/*** 题目&#xff1a;谈谈你对多线程锁的理解&#xff0c;8锁案例说明* 口诀&#xff1a;线程 操作 资源类* 8…

CLIP--Learning Transferable Visual Models From Natural Language Supervision

参考&#xff1a;CLIP论文笔记--《Learning Transferable Visual Models From Natural Language Supervision》_visual n-grams模型-CSDN博客 openAI&#xff0c;2021&#xff0c;将图片和文字联系在一起&#xff0c;----->得到一个能非常好表达图片和文字的模型主题&#…

Pandas 使用 concat 数据合并你学会了吗?

1. 使用pd.concat()级联 pandas使用pd.concat函数&#xff0c;与np.concatenate函数类似 # 导包import numpy as npimport pandas as pd​# 为方便讲解&#xff0c;我们首先定义一个生成DataFrame的函数def make_df(indexs,columns): data [[str(j)str(i) for j in colum…

RabbitMQ延时队列

一、RabbitMQ下载并使用插件 1、查看RabbitMQ插件的文件路径 docker inspect rabbitmq 找到Mounts下面Name:rabbitmq_plugin的Source即为插件路径 使用 cd 进入到该目录 2、下载插件 wget https://github.com/rabbitmq/rabbitmq-delayed-message-exchange/releases/download…

C# 使用Aspose生成和修改文档

Aspose库 C#中的Aspose库是一个强大的文件处理库&#xff0c;可以用于各种文件格式的创建、编辑、转换和操作。该库提供了丰富的功能&#xff0c;包括处理文档、电子表格、幻灯片、PDF、图像等多种文件格式&#xff0c;能够轻松实现文件的读取、写入、格式化、样式设置、数据操…

Java Apache Jaccard文本相似度匹配初体验

文章目录 前言一、文本相似度算法的选择二、常见的文本相似度算法介绍三、使用示例1、引入jar包2、方法示例3、Jaccard源码剖析4、Jaccard源码解释 写在最后 前言 产品今天提了个需求&#xff0c;大概是这样的&#xff0c;来&#xff0c;请看大屏幕。。。额。。。搞错了&#…