HTML复习day01
1. 常见的浏览器内核
1 IE Trident
2 firefox Gecko
3 Safari webkit (安卓 苹果 大部分国产)
4 chrome Chromlum/blink
2. web 标准
web 标准的三层组成 结构 表现 和行为
3. HTML 是一种超文本标记语言
组成 由文本和标签和图片组成
4. HTML骨架
<html>
<head> </head>
<body> </body>
</html> 5. 我的第一个网页
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>我的第一个网页</title>
</head> <body>
<h1>Hello World</h1>
</body> </html>
6. 标签分为单标签和双标签 <br /> | <h1> </h1>
7. 标签之间关系有包含和并列
<body>
<h1>Hello World</h1>
</body>
8. vscode 的首次使用
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>我的工具</title>
</head> <body>
集成开发工具真好用
</body> </html>
9. 编码
常用的编码 GB2312 简体中文 BIG5繁体中文 GBK 中文 UTF-8万国码
10. 标签的语义化
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head> <body>
在合适的地方放合适的标签
</body> </html>
11. 标题标签 <!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head> <body>
<h1>hello World</h1>
<h2>hello world</h2>
<h3>hello world</h3>
<h4>hello world</h4>
<h5>hello world</h5>
<h6>hello world</h6>
</body> </html>
13. 段落 水平线 换行
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head> <body>
<h1>新闻标题</h1>
<hr>
<p>这是第一段</p>
<p>这个是<br /> 第二段
</p>
</body> </html>
14. 文本格式化
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<b>加粗</b>
<strong>加粗强调</strong>
<i>倾斜</i>
<em>倾斜强调</em> <s>删除</s>
<del>强调删除</del> <u>下划线</u>
<ins>强调下划线</ins>
</body>
</html>
15. 图像标签
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head> <body>
<img src="./img.jpg" alt="src是图片的路径属性">
</body> </html>
16.链接标签
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head> <body>
<a href="http://www.baidu.com">百度一下</a>
<a href="./div.html">div演示</a>
<a href="#">空链接</a>
<a href="./07图像标签.html"><img src="./img.jpg" alt=""></a>
</body> </html>
17. HTML注释
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>注释</h1>
<!-- 这是一行注释-->
添加和取消注释 Ctrl+？
</body>
</html> 18. 路径
D:\work\day01 这种叫绝对路径
../../day01 这种叫相对路径
https://pic.cnblogs.com/avatar/2249755/20210127142533.png 这种叫URL网络路径 0
18
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head> <body>
<div>刘亦菲</div>
<div>赵丽颖</div> <span>迪丽热巴</span>
<span>古力娜扎</span>
</body> </html>
19. 锚点定位 就是点击链接快速查找功能的实现
<a href="#man">2.圣诞老人的由来 </a> <br />
<a href="#tree">3.圣诞树的由来 </a> <br /> <h2 id="man">圣诞老人的由来</h2>
<h2 id="tree">圣诞树的由来</h2>
20 base标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<base target="_blank">
</head>
<body>
<a href="http://www.baidu.com">百度</a>
<a href="http://www.sina.com">新浪</a>
<a href="http://www.sohu.com">搜狐</a>
<a href="http://www.163.com">网易</a>
</body>
</html>
20 预格式化文本标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<pre>
静夜思
作者：李白 (唐) 床前明月光，疑是地上霜。
举头望明月，低头思故乡。
</pre>
</body>
</html>
21-特殊字符
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
楚乔是 燕洵 的 <br />
<大于号>小于号
</body>
</html>
综合练习1
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>耶稣 jesus</title>
</head>
<body>
<h2>耶稣</h2>
<p>
耶稣（公元元年/前4年—公元30年），是基督宗教里的核心人物，基督宗教认为他是《旧约圣经》中所预言的弥赛亚（救世主，基督），并且是三位一体中圣子的位格，常被称为“拿撒勒人耶稣”。 耶稣出生于以色列的伯利恒，三十岁左右开始传道，三十三岁时在总督本丢彼拉多执政时受难、为了全人类的罪被钉死在十字架上，第三天复活、并向门徒显现四十天后升天，坐在全能天父的右边，他必要在世界穷尽的审判之日在光荣中降来，建立荣耀的天国，给「善」带来最后的胜利。 《圣经》记载：耶稣是神的儿子，神爱世人，甚至将他的独生子赐给他们，叫一切信他的，不至灭亡，反得永生。
</p> <img src="data:images/ys.jpg" /> <p>
耶稣基督有许多别的头衔和称呼：以马内利、神的儿子、人子、道、中保、大祭司、君王、万王之王、万主之主、羔羊、明亮的晨星、大卫的儿子（大卫的子孙）、大卫的根、拉比或拉波尼（老师的意思）、拿撒勒人耶稣等等。耶稣有好几次说到“我是”：我就是生命的粮（约翰福音6：35），我是世界的光（约8：12），我是好牧人（约10：11），我是羊的门（约10：7），我是道路、真理、生命（约14：6），我是真葡萄树（约15：1）。这里的“我是”是隐含地引用旧约，提示耶稣是道成肉身的救主身份。
</p> <p>
耶稣是顺服父神的旨意为罪人的缘故死在十字架上，成了赎罪祭，以义的代替不义的，使凡相信他的，因着他的宝血，得称为义。基督又按照圣经所说，第三天从死里复活，败坏那掌死权的魔鬼，升上高天，掳掠众仇敌，现今坐在父神的右边，是神与人之间唯一的中保，也唯有借着他，信徒可以进到父面前。将来他必要再来，建立荣耀的国度。[2]
</p>
</body>
</html>
综合练习2
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>圣诞的由来</title>
</head>
<body>
<h1>圣诞节的那些事</h1> 1.圣诞是怎样由来的 <br />
<a href="#man">2.圣诞老人的由来 </a> <br />
<a href="#tree">3.圣诞树的由来 </a> <br /> <hr />
<h2>圣诞是怎样由来的</h2> <p>圣诞节是基督教世界最大的节日。一般认为12月25日作为圣诞节可能开始于公元336年的罗马教会。4世纪初，1月6日是罗马帝国东部各教会纪念<a href="yesu.html" target="_blank">耶稣</a>降生和受洗的双重节日，即上帝通过耶稣向世人显示自己。 这一天又是罗马历书的冬至节，意味着万物复苏的开始。可能由于这个原因，罗马教会才选择这一天作为圣诞节。后来，因为各地教会使用的历书不同，具体日期不能统一，于是就把12月24日到第二年的1月6日定为圣诞节节期（Christmas Tide），各地教会可以根据当地具体情况在这段节期之内庆祝圣诞节。 在欧美许多国家里，人们非常重视这个节日，把它和新年连在一起，而庆祝活动之热闹与隆重大大超过了新年，成为一个全民的节日。12月24日平安夜、12月25日圣诞节的主要纪念活动都与耶稣降生的传说有关 。</p> <img src="data:images/t1.gif" /> <h2 id="man">圣诞老人的由来</h2> <p>圣诞节当然少不了圣诞老人，根据圣经记载，书中并没有提起这一号人物。到底他是如何成为圣诞的主角之一呢？</p> <img src="data:images/t2.jpg" />
<p>相传在一千六百多年前，荷兰巴里地方有一个老人，名叫尼古拉斯，他一生最爱帮助贫穷的人家。其中有一次他帮助三个贫穷的少女，送她们三袋金子以逃过被卖的不幸。 到了一八二二年，由荷兰传教士把这位伟大慈善家的故事传到美国，装扮圣诞老人渐渐地流行于世界各国。根据调查，以上故事还有下文；当尼古拉斯偷偷把其中一袋金子送给其中一名女子时，他把金子从其中一个窗户扔进去，恰好掉进晾在壁炉上的一只长袜中。于是，将礼物放在圣诞袜子的送礼方法便传到至今。</p> <img src="data:images/t3.jpg" /> <p>在平安夜里，孩子总会把一双双色彩缤纷的袜子挂在床头，然后在袜子旁边放杯热牛奶让圣诞老人喝，以让劳苦功高的圣诞老人解渴，并送份大礼给自己。?</p> <h2 id="tree">圣诞树的由来</h2> <p>圣诞一直是庆祝圣诞节不可少的装饰物，如果家中没有圣诞树，就大大减少了过节气氛。关于圣诞树的来源有多种不同的传说。</p> <p>其中一个是说：大约在十六世纪，圣诞树最先出现在德国，德国人把长青的松柏枝拿到屋中去摆设，将之成为圣诞树。后来，由德国人马丁路德把蜡烛放在树林中的枞树枝，然后点燃蜡烛，使它看起来像是引导人们到伯利恒去。而近今日，人们已经改用粉色的小灯泡了。
</p> <img src="data:images/t4.jpg" /> <p> 另一个传说记载。在很久以前，曾有一位农民，在圣诞节那天遇到一个穷苦小孩，他热情地接待了这个儿童。儿童临走时折下一根松枝插在地上，松枝立即变成一棵树，上面都挂满礼物，以答谢农民的好意。</p> <p>圣诞树真正出现在圣诞节时，首先见于德国，之后又传入欧洲和美国，并以其优美的姿态，成为圣诞节不可缺少的装饰。圣诞树的种类繁多，有天然松柏圣诞树、也有人造圣诞树及白色圣诞树。</p> <p> 每棵圣诞树上都挂满琳琅满目的装饰品，但每棵树的顶端必定有个特大的星星，象征三博士跟随该星而找到耶稣，而且也只有该家庭的一家之主可以把这棵希望之星挂上。</p> 更多内容可以百度一下
<a href="http://www.baidu.com" target="_blank"> <img src="data:images/arr.gif" /> </a> </body>
</html>
素材
HTML复习day01的更多相关文章
- JAVAWEB复习day01
一.基础知识 1.一个html文件开始和结束的标签<html></html> 2.html的两部分<head>设置相关信息</head>,<bod ...
- JAVA基础复习day-01
1.基础语法 1.1.基础语法规则 1.1.1.Java代码实现 代码示例: public class Hello{ public static void main(String[] args){ S ...
- 线下---复习day01
目录 1 个人介绍 2 关于编辑器 3 基础串讲 3.1 解释型和编译型 3.2 数据类型 3.2.1 一切皆对象 3.2.1 深浅copy 3.2.3 可变类型与不可变类型 3.3 字符编码 3.4 ...
- MySql学习笔记04
复习 day01 数据库相关: create database db4 character set utf8; show databases; show create database db4; dr ...
- python复习之路-Day01
数据类型初识 1.数字 2 是一个整数的例子.长整数 不过是大一些的整数.3.23和52.3E-4是浮点数的例子.E标记表示10的幂.在这里,52.3E-4表示52.3 * 10-4.(-5+4j)和 ...
- Java复习整理 day01
练习代码: 1 //这条语句说明这个Java文件在demo的包下 2 package demo1; 3 /** 4 * 5 * @author 王兴平 6 * 这个是第一个hello world 案例 ...
- 传智播客JavaWeb day01 快捷键、XML
2015-01-14 一直计划着学习java,今天晚上终于下定决心看了下传智播客朴乾老师的javaweb开发视频day01之第一讲,主要内容是开发工具简单介绍.怎么创建工程.Junit的介绍,我是C# ...
- day01课程回顾，数据类型
Day01 Python的分类 Cpython:代码àc字节码->机器码 一行一行的编译执行 Pypy: 代码àc字节码->机器码 全部转换完再执行 其他python 代码- ...
- JAVA基础部分复习(一、8中基础类型，以及String相关内容)
以下是关于java中8种基本类型的介绍说明: package cn.review.day01; /** * java基础复习,8种数据类型 * (byte,short,long,int,double, ...
随机推荐
- OpenWRT19.07_命令行_重拨wan_重启路由
OpenWRT19.07_命令行_重拨wan_重启路由 转载注明来源: 本文链接 来自osnosn的博客,写于 2020-10-19. 写OpenWRT的脚本时,需要用到一些重启命令 以下的命令中的参 ...
- Dota游戏匹配的所有组合
在Dota游戏中有一种匹配玩法,任意5人以下玩家组队,加入匹配系统,由系统组合出5人 vs 5人的组合进行游戏,比如2人+3人 vs 1人+4人.抽象出这个问题,就变成两边各有m个玩家,最多允许n个 ...
- 万万没想到，JVM内存区域的面试题也可以问的这么难？
二.Java内存区域 1.Java内存结构 内存结构 程序计数器 当前线程所执行字节码的行号指示器.若当前方法是native的,那么程序计数器的值就是undefined. 线程私有,Java内存区域中 ...
- Debian安装HomeBrew
前言 HomeBrew 的用处我想使用 Mac 的开发人员都知道, 本篇讲解如何在 Debian 上安装 BrewLinux 更新: 后来发现并不是很好用, 不建议使用 官方推荐的脚本安装 注意这里只 ...
- linux + svn提交日志不能显示 日期一直都是1970-01-01
网上很多都是说将svn安装目录下的svnserve.conf文件中的anon-access 设置为read,但是 经查阅并测试, 设置为: anon-access = none 是正确的,设置成 r ...
- JDK1.7-HashMap原理
JDK1.7 HashMap 如何在源码上添加自己的注释 打开jdk下载位置 解压src文件夹,打开idea,ctrl+shift+alt+s打开项目配置 选择jdk版本1.7,然后点击Sourcep ...
- 【Java基础】数组和算法
数组和算法 查找算法 线性查找 ... 二分查找 二分查找要求数据结构是有序的. package com.parzulpan.java.ch03; /** * @Author : parzulpan ...
- 剑指offer 面试题10.2：青蛙变态跳台阶
题目描述 一只青蛙一次可以跳上1级台阶,也可以跳上2级--它也可以跳上n级.求该青蛙跳上一个n级的台阶总共有多少种跳法. 编程思想 因为n级台阶,第一步有n种跳法:跳1级.跳2级.到跳n级跳1级,剩下 ...
- Java开发手册之工程结构
1.在线上生产环境,JVM 的 Xms 和 Xmx 设置一样大小的内存容量,避免在 GC 后调整堆大小带来的压力. 2.给 JVM 环境参数设置-XX:+HeapDumpOnOutOfMemoryEr ...
- Error: Could not open input file: /usr/java/jdk1.7.0_07/jre/lib/jsse.pack
[root@localhost ~]# rpm -ivh jdk-7u7-linux-i586.rpm Preparing... ################################### ...