前端学习(8):HTML的基本属性和结构

一、HTML文档结构

<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>css样式优先级</title> </head> <body> </body> </html>

  1. <!DOCTYPE html>声明为HTML5文档(html版本说明)
  2. <html>....<html/>:是文档的开始标记和结束标记。是html页面的根元素,在他们之间是文档的头部。包含文档的元数据(meta)数据
  3. <title>....</title>定义网页标题,在浏览器标题栏显示
  4. <body>.....<body/>之间的文本是可见的网页主题内容

注意:对于中文网页需要使用 声明编码,否则会出现乱码。有些浏览器会设置 GBK 为默认编码,则你需要设置为 。

二、HTML标签格式

  • HTML标签是由尖括号包围的关键字,如''<html>, <div>
  • HTML标签通常是成对出现的,比如:<div>和</div>,第一个标签是开始,第二个标签是结束。结束标签会有斜线。
  • 也有一部分标签是单独呈现的,比如:<br/>、<hr/>、<img src="1.jpg" />等。
  • 标签里面可以有若干属性,也可以不带属性。

标签的语法:

  • <标签名 属性1=“属性值1” 属性2=“属性值2”……>内容部分
  • <标签名 属性1=“属性值1” 属性2=“属性值2”…… />

几个很重要的属性:

  • id:定义标签的唯一ID,HTML文档树中唯一
  • class:为html元素定义一个或多个类名(classname)(CSS样式类名)
  • style:规定元素的行内样式(CSS样式)

三、HTML注释

<!--注释内容-->

注释是代码之母。

四、标签

<!DOCTYPE>声明必须是 HTML 文档的第一行,位于 <html>标签之前。

<!DOCTYPE> 声明不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。

<!DOCTYPE html>
<html lang="en">
<header title="歌谣">haho</header>
<footer title="yao">hah</footer>
<body></body>
</html>

运行结果

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

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

相关文章

借助云开发轻松实现后台数据批量导出丨实战

小程序导出数据到excel表&#xff0c;借助云开发后台实现excel数据的保存 我们在开发小程序的过程中&#xff0c;可能会有这样的需求&#xff1a;如何将云数据库里的数据批量导出到excel表里&#xff1f; 这个需求可以用强大的云开发轻松实现&#xff01; 这里需要用到云函数&a…

Storm的ack机制在项目应用中的坑

正在学习storm的大兄弟们&#xff0c;我又来传道授业解惑了&#xff0c;是不是觉得自己会用ack了。好吧&#xff0c;那就让我开始啪啪打你们脸吧。 先说一下ACK机制&#xff1a; 为了保证数据能正确的被处理, 对于spout产生的每一个tuple, storm都会进行跟踪。 这里面涉及到ac…

云开发数据库VS传统数据库丨云开发101

云开发数据库与传统数据库的不同 在小程序云开发中&#xff0c;最核心的便是三大组件&#xff1a;数据库、云存储和云函数&#xff0c;从今天开始&#xff0c;我们将开始隔日更的专栏文章&#xff0c;云开发101&#xff0c;在第一周&#xff0c;我们将从最最核心的数据库开始说…

前端学习(10):HTML语义化

我理解的HTML语义化 经过查看别人博文中的一些描述&#xff0c;我将HTML的语义化总结为&#xff1a; 用最恰当的标签来标记内容。 该如何理解呢&#xff1f;比如需要加入一个标题&#xff0c;这个标题的字体比正文的要大写&#xff0c;还要加粗。能够实现这种效果的方法有很多…

博客中gitalk最新评论的获取 github api使用

博客中&#xff0c;对于网友的评论以及每篇文章的评论数还是很重要的。但是基于静态的页面想要存储动态的评论数据是比较难的&#xff0c;一般博客主题中都内置了评论插件&#xff0c;但是博客主题中对于最新评论的支持显示还是很少的&#xff0c;至少目前我是没怎么发现。博客…

前端学习(11):标题和段落

<!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>标题和段落</title> </head> <body><h1>我是歌谣</h1><h2>我是歌谣</h2><h3>我是歌谣</h3>&l…

Kafka文件存储机制

Kafka是什么 Kafka是最初由Linkedin公司开发&#xff0c;是一个分布式、分区的、多副本的、多订阅者&#xff0c;基于zookeeper协调的分布式日志系统(也可以当做MQ系统)&#xff0c;常见可以用于web/nginx日志、访问日志&#xff0c;消息服务等等&#xff0c;Linkedin于2010年贡…

云开发0基础训练营第二期热力来袭!

第二期云开发0基础训练营热力来袭&#xff01;课程升级、更佳体验、依旧免费&#xff01;每年的 “金九银十” 都是传说中的学习黄金期&#xff01;这期间在校的小伙伴面临开学季/求职季/考研季挑战&#xff0c;已经步入社会的也即将步入年终前的冲刺阶段。所以&#xff0c;这段…

前端学习(14):相对路径和绝对路径

目录结构 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><meta http-equiv"X-UA-Compatible" conte…

discuz数据从godaddy主机中导出的mysql数据乱码变问号???的解决方法

从godaddy主机导出的mysql数据安装在本地电脑上发现原来的中文都变成了问号&#xff1f;godaddy主机中的数据库版本是5.0.67&#xff0c;charsetutf8 collationutf8_general_ci 而我的supesite的版本是gbk的&#xff0c;导出的数据也是 CREATE TABLE cdb_access (……) ENGINE…

jvm的新生代和老年代简介

新生代分为三个区域&#xff0c;一个Eden区和两个Survivor区&#xff0c;它们之间的比例为&#xff08;8&#xff1a;1&#xff1a;1&#xff09;&#xff0c;这个比例也是可以修改的。通常情况下&#xff0c;对象主要分配在新生代的Eden区上&#xff0c;少数情况下也可能会直接…

NIO核心框架介绍

NIO共引入了4个概念&#xff1a; - 缓存区&#xff1a;表示数据存放的容器&#xff0c;提供可读写的数据缓存区&#xff1b; - 字符集&#xff1a;用来对缓存数据进行解码和编码&#xff0c;在字节和Unicode字符之间转换&#xff1b; - 通道&#xff1a;用来接收或发送数据&…

前端学习(16):跳转链接小练习

点击图片实现跳转 目录结构 header.html <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><meta http-equiv&q…

云开发的数据库权限机制解读丨云开发101

在使用云开发进行开发时&#xff0c;数据库权限是一个让不少人困扰的部分&#xff0c;四种数据库权限&#xff0c;到底是什么意思&#xff1f;其各自的权限、应用场景都是什么&#xff1f;大多数人对于这个机制&#xff0c;还是模糊的。为了帮助大家进行更好的开发&#xff0c;…

Java中的NIO非阻塞编程

在JDK1.4以前&#xff0c;Java的IO操作集中在java.io这个包中&#xff0c;是基于流的阻塞API。对于大多数应用来说&#xff0c;这样的API使用很方便&#xff0c;然而&#xff0c;一些对性能要求较高的应用&#xff0c;尤其是服务端应用&#xff0c;往往需要一个更为有效的方式来…

Nginx----基础

静态资源服务 通过本地文件系统提供服务&#xff1a;对css&#xff0c;js文件&#xff0c;图片等静态文件 反向代理服务 缓存&#xff1a;将一些数据经常不变的&#xff0c;缓存到Nginx中&#xff0c;直接给用户提供服务 负载均衡 api服务 OpenResty 数据库的服务比较简单&…

深入理解JVM—JVM内存模型

我们知道&#xff0c;计算机CPU和内存的交互是最频繁的&#xff0c;内存是我们的高速缓存区&#xff0c;用户磁盘和CPU的交互&#xff0c;而CPU运转速度越来越快&#xff0c;磁盘远远跟不上CPU的读写速度&#xff0c;才设计了内存&#xff0c;用户缓冲用户IO等待导致CPU的等待成…

Nginx----进阶

用Nginx搭建一个静态的web资源服务器/动静分离 简单使用 1、可以在安装的nginx目录新建自己的目录zy&#xff08;和conf在一个目录下&#xff0c;也就是和html目录在一个目录下&#xff0c;注意如果使用/zy&#xff0c;那么zy目录需要创建在linux根目录&#xff09;&#xff0c…

小程序·云开发的HTTP API调用丨实战

小程序云开发之httpApi调用。 小程序云开发之httpApi调用&#xff08;返回“47001处理”&#xff09; 技术栈 采用 nodejs express 搭建web服务器&#xff0c;采用 axios 请求第三方 httpApi nodejsexpressaxios 项目结构 通过应用生成器工具 express-generator 可以快速创建一…

Zookeeper----基本原理

Zookeeper作用是什么&#xff1f; 协调分布式系统中的多个服务器&#xff0c;使得系统可以正常工作。 Zookeeper提供了什么&#xff1f; 实际上他只提供了三个东西&#xff0c;一个是文件系统&#xff0c;一个是通知机制&#xff0c;还有一个是集群管理机制 Zookeeper可以做什么…