html学习笔记1
一.特殊按键和快捷键
键盘上除了有字母、数字之外,还有一些特殊的按键:ctrl、shift、alt、tab
● ctrl键是英语control“控制”的意思,这个按键,单独按没有任何作用,都要和其他的按键一起按才有用。比如ctrl+c,表示同时按住ctrl键和c键,一会儿将知道这个功能是复制。
● shift键是英语shift“换挡”的意思,按下这个按键同时击打字母,打出的就是大写字母。熟悉shift键来打大写字母,尽量少用大小写锁定键。
● alt键是英语alternate“调整”的意思,和ctrl一样,自己按没啥用,都要和其他的按键一起按才有用。比如alt+f4,表示关闭当前的窗口, alt+f4快速关闭窗口。
● tab键是用于table“制表符”的意思,经常实现“切换的功能”。比如我们在word软件中同时打开了两个文档,可以用ctrl+tab键,来在两个文档之间切换。 当然,可以用alt+tab键来切换程序。
必须熟练掌握下面的快捷键:
ctrl+c 复制
ctrl+v 粘贴
ctrl+x 剪切(就是移动文件,在原来的文件夹ctrl+x一个文件,然后在新文件夹中ctrl+v粘贴)
ctrl+tab 切换(具体切换什么,要看是什么软件)
alt+F4 关闭程序
F2 重命名
F5 刷新,比如看网页的时候,想刷新网页,按f5
ctrl+z 撤销,就是这一步干错了,就ctrl+z撤销
windows+E 打开资源管理器
windows+D 显示桌面
ctrl+空格 切换中英文,严禁用shift键切换。
二.浏览网页的一些基本原理
1.上网的时候,是有真实的、物理的文件传输的!
2.所以我们经常感觉第二次打开网页,比第一次快,这是因为第一次打开网页的时候,所有的图片和文件都已经存过来了。
3.服务器上存放着网页的相关文件,包括html文件、css文件、js文件、图片等。当我们打开浏览器,输入网址,我们的计算机就会对这些文件发出HTTP请求。 服务器收到请求之后,会把这些文件通过HTTP协议,传输到我们的计算机中(保存到电脑中的某个临时文件夹中)。这些文件,将在我们计算机本地的浏览器中,进行渲染、呈递。
3. HTTP:超文本传输协议,Hypertext Transfer Protocol。
这是一个文件的传输协议,我们上网的时候,所有的文件都是通过HTTP这个协议,从服务器上传输到客户的电脑里面的。
4.index.html是默认的首页文件。
三.HTML初步认识
1.纯文本文件就是这样的文件:
1) 只有文本,没有样式;
2) 用记事本等纯文本编辑器可读,不是乱码
3)html、css、js都是纯本文的。
2. HTML是负责描述文档语义的语言
HTML是英语HyperText Markup Language的缩写,超文本标记语言。
.html就是网页的格式。
html提供了很多标签对儿,可以给文本增加不同的语义。比如:
<h1> </h1>标签对儿,主标题。
<h2> </h2>标签对儿,二级标题。
<p> </p> 标签对儿,普通段落。
现在的业界的标准,网页技术严格的三层分离:html就是负责描述页面的语义;css负责描述页面的样式;js负责描述页面的动态效果的。
所以,html不能让文字居中,不能更改文字字号、字体、颜色。因为这些都是属于样式范畴,都是css干的事儿;html不能让盒子运动起来,因为这些属性行为范畴,都是js干的事儿。
html只能干一件事儿,就是通过标签对儿,给文本增加语义。这是html唯一能做的。
html中,除了语义,其他什么都没有。
html是一个纯本文文件(就是用txt文件改名而成),用一些标签来描述文字的语义,这些标签在浏览器里面是看不到的,所以称为“超文本”,所以就是“超文本标记语言”了。
比如,h1标签有什么作用?
正确答案:给文本增加主标题的语义
错误答案:给文字加粗、加黑、变大
四、开发工具Sublime介绍
sublime中的常用快捷键:
ctrl+滚轮 放大缩小文字
ctrl+shift+d 复制当前行
ctrl+shift+k 删除当前行
ctrl+shift+↑ 上移当前行
ctrl+shift+↓ 下移当前行
以后击打标签的时候,仅仅需要输入标签的名字,然后按tab就可以自动生成标签对儿了。
比如,输入p然后按tab,软件自动生成:
1 <p></p> |
五、HTML骨架和基本语法
1.html有基本骨架,这个骨架能够用sublime快速生成:
骨架抽象出来:
1 <html> 2 <head> 3 4 </head> 5 <body> 6 7 </body> 8 </html> |
网页的最外层的标签对儿是<html></html>标签对儿,里面有两部分,分别是head和body。
head标签中,描述网页的配置;body中的内容,才是用户可以看见的内容。
完整的骨架:
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> 5 <title>哈哈哈</title> 6 </head> 7 <body> 8 <h1>我是一个主标题</h1> 9 <p>我是一个小段落</p> 10 </body> 11 </html> |
第1行,就是网页的声明头。术语叫做DocType Defintion,文档类型定义,简称DTD。这行语句非常的复杂,里面暗含了一个网址。W3C就是出web规范的组织机构。html、css、js的规范都是W3C定义发布的。world wide web coalition , 国际万维网联盟。网页声明头可以告诉浏览器,这是一个什么标准的页面。
第2行,是最大的html标签,所有的网页内容,都要包裹在这个标签对儿里面。
我们发现,html标签中,有两个属性:
xmlns="http://www.w3.org/1999/xhtml" 命名空间,就是一个规范;
xml:lang="en" 语言是英语
第3行,就是head标签,就是配置。
第4行,<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> 字符集的配置
第5行,<title>哈哈哈</title> 网页的标题,可以显示在浏览器的标签栏中。
第7行,body标签就是网页的内容,用户能够看见。
html学习笔记1的更多相关文章
- js学习笔记:webpack基础入门(一)
之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...
- PHP-自定义模板-学习笔记
1. 开始 这几天,看了李炎恢老师的<PHP第二季度视频>中的“章节7:创建TPL自定义模板”,做一个学习笔记,通过绘制架构图.UML类图和思维导图,来对加深理解. 2. 整体架构图 ...
- PHP-会员登录与注册例子解析-学习笔记
1.开始 最近开始学习李炎恢老师的<PHP第二季度视频>中的“章节5:使用OOP注册会员”,做一个学习笔记,通过绘制基本页面流程和UML类图,来对加深理解. 2.基本页面流程 3.通过UM ...
- 2014年暑假c#学习笔记目录
2014年暑假c#学习笔记 一.C#编程基础 1. c#编程基础之枚举 2. c#编程基础之函数可变参数 3. c#编程基础之字符串基础 4. c#编程基础之字符串函数 5.c#编程基础之ref.ou ...
- JAVA GUI编程学习笔记目录
2014年暑假JAVA GUI编程学习笔记目录 1.JAVA之GUI编程概述 2.JAVA之GUI编程布局 3.JAVA之GUI编程Frame窗口 4.JAVA之GUI编程事件监听机制 5.JAVA之 ...
- seaJs学习笔记2 – seaJs组建库的使用
原文地址:seaJs学习笔记2 – seaJs组建库的使用 我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓. 所以不断的学习将是源源不断. 最 ...
- CSS学习笔记
CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...
- HTML学习笔记
HTML学习笔记 2016年12月15日整理 Chapter1 URL(scheme://host.domain:port/path/filename) scheme: 定义因特网服务的类型,常见的为 ...
- DirectX Graphics Infrastructure(DXGI):最佳范例 学习笔记
今天要学习的这篇文章写的算是比较早的了,大概在DX11时代就写好了,当时龙书11版看得很潦草,并没有注意这篇文章,现在看12,觉得是跳不过去的一篇文章,地址如下: https://msdn.micro ...
- ucos实时操作系统学习笔记——任务间通信(消息)
ucos另一种任务间通信的机制是消息(mbox),个人感觉是它是queue中只有一个信息的特殊情况,从代码中可以很清楚的看到,因为之前有关于queue的学习笔记,所以一并讲一下mbox.为什么有了qu ...
随机推荐
- ab性能并发测试语法
ab测试语法ab -n 全部请求数 -c 并发数 测试url 例如:ab -n 10000 -c 1000 http://myweb.com/test.html Server Software: Ap ...
- 使用MySQL中的EXPLAIN解释命令来检查SQL
我们看到许多客户的系统因为SQL及数据库设计的很差所以导致许多性能上的问题,这些问题不好解决,但是可以采用一套简单的策略来检查生产系统,发现并纠正一些共性问题. 很显然,您应该尽最大努力设计出最好的数 ...
- CMSIS Example - osTimer osTimerCreate osTimerStart
osTimerId timer; uint32_t cnt=; void timerHandler( void * arg ) { cnt++; osTimerStart( timer, ); } o ...
- POJ 3006 Dirichlet's Theorem on Arithmetic Progressions 快筛质数
题目大意:给出一个等差数列,问这个等差数列的第n个素数是什么. 思路:这题主要考怎样筛素数,线性筛.详见代码. CODE: #include <cstdio> #include <c ...
- Navicat 导入数据报错 --- 1153 - Got a packet bigger than 'max_allowed_packet' bytes
在用Navicat导入SQL文件时报错:MySql 错误 Err [Imp] 1153 - Got a packet bigger than 'max_allowed_packet' bytes 查了 ...
- HDU 4287 Intelligent IME hash
Intelligent IME Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.hdu.edu.cn/showproblem.php?p ...
- 使用.net(C#)发送邮件学习手册(带成功案例)
使用.net(C#)发送邮件学习手册(带成功案例) 1.了解发送邮件的三种方式 2.实例介绍使用client.DeliveryMethod = System.Net.Mail.SmtpDelivery ...
- 【Java编码准则】の #11不要使用Object.equals()来比較密钥值
java.lang.Object.equals()函数默认情况下是不能用来比較组合对象的,比如密钥值.非常多Key类没有覆写equals()函数,因此,组合对象的比較必须单独比較里面的各个类型以保证正 ...
- window.showModalDialog 与window.open传递参数的不同?
简单的说,就是一个在弹出窗口之后可以做其它的事,即window.open 另一个在弹出窗口之后不能做其它的事,只能是关闭了当前的窗口之后才能做其它的事,即window.showModalDialog ...
- android开发环境 eclipse + android sdk配置笔记
本开发环境为:eclipse + android sdk,步骤说明的顺序,没有特别要求,看个人爱好了 步骤说明: 1.安装eclipse 2.配置jdk 3.安装android sdk 4.安装ADT ...