目录
- HTML简介
- 打开HTML文件方式
- HTML标签
- 双标签
- 单标签
- Head内常用标签
- Body内常用标签
- 块级标签
- 行内标签
- 常用标签
- 标签的两个重要属性
- 列表标签
- 特殊符号
- emmet插件的使用
1、HTML简介
超文本标记语言,如果想让浏览器能够渲染出你写的页面,你就必须遵循HTML语法,浏览器看到的页面,内部其实都是HTML代码。
HTML就是书写网页的一套标准,由于HTML代码非常杂乱无章,所以我们习惯性的用注释来划定区域方便后续的查找。
HTML的文档结构:
<html>
<head>head内的标签不是给用户看的,而是定义一些配置主要是给浏览器看的</head> <body>body内的标签,写什么浏览器就渲染什么,用户就能看到什么</body>
</html>
HTML的注释<!–注释–>
除了html可以书写前端页面之外,xml也可以书写前端页面。
odoo框架内部的前端页面全部都是用xml书写的
odoo是公司内部管理软件 – ERP
2、打开HTML文件方式
- 找到文件所在位置右键选择浏览器打开
- 在pycharm内部,集成了自动调用浏览器的功能,直接点击即可,前提是已安装了对应的浏览器,推荐使用谷歌浏览器,开发用的比较多。
3、HTML标签
标签分类1:双标签和单标签
1、双标签
<h1></h1>
2、单标签(自闭合标签)
<img/>
head内常用标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title> <!--网页标题-->
<meta name="viewport" content="width=device-width,initial-scale=1">
<style>
h1{
color: greenyellow;
}
</style> <!--内部用来书写css代码-->
<script>
alert(123) <!-- 弹框提醒 -->
</script> <!--内部用来书写js代码,也可以用来引入外部js文件-->
<script src="myjs.js"></script>
<link rel="stylesheet" href="mycss.css"> <!--用来引入外部css文件-->
<meta http-equiv="refresh" content="2;URL=https://www.oldboyedu.com">
<!--上行meta表示两秒之后告诉浏览器跳转到老男孩的页面-->
<meta http-equiv="x-ua-compatible" content="IE=edge"> <!--告诉IE浏览器以最高级模式渲染文档-->
<meta http-equiv="content-type" charset="UTF8"> <!--指定文档的编码类型-->
<meta name="keywords" content="老男孩,培训,Python培训"> <!--当你在用浏览器搜索的时候,只要输入了keywords后面指定的关键字那么该网页都有可能被百度搜索出来展示给用户-->
<meta name="description" content="老男孩教育培训机构"> <!--网页的描述性信息-->
</head>
<body>
</body>
</html>
body内常用标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>我是h1</h1> <!--标题标签-->
<h2>我是h2</h2>
<h3>我是h3</h3>
我是普通文本,没有标签
<b>加粗标签</b>
<i>斜体标签</i>
<u>下划线标签</u>
<s>删除线标签</s>
<p>秋天该很好 你若尚在
© 版权声明
免责声明
本站提供的一切软件、教程和内容信息仅限用于学习和研究,不得用于商业或者非法用途,否则,一切后果请用户自负;本站信息来自网络收集整理,版权争议与本站无关,您必须在下载后的24个小时之内,从您的电脑或手机中彻底删除相应的内容;如果您喜欢该内容,请支持正版,得到更好的服务;我们非常重视版权问题,如有侵权请与我们联系,敬请谅解!
邮箱:sanshi@sanshi.link
相关文章
暂无评论...