HTML的学习笔记
一、HTML的概述(了解)
a.html是什么 : hypertext markup language 超文本标记语言
超文本:音频,视频,图片称为超文本。.
标记 :<英文单词或者字母>称为标记. 一个HTML页面都是由各种标记组成。
b.作用:编写HTML页面。
c.HTML语言不是一个编程语言(有编译过程),而是一个标记语言(没有编译过程).
HTML页面直接由浏览器解析执行。
二、HTML的历史(了解)
三、HTML的网络术语(明白)
* 网页 :由各种标记组成的一个页面就叫网页 .
* 主页(首页) : 一个网站的起始页面或者导航页面 .
* 标记:<p>称为开始标记 </p>称为结束标记. 也叫标签.每个标签都规定好了特殊的含义。
* 元素:<p>内容</p> 称为元素.
* 属性: 给每一个标签所做的辅助信息。
* xhtml: 符合XML语法标准的HTML。
* dhtml:dynamic,动态的。javascript + css + html 合起来的页面就是一个dhtml
* http:协议标准。用来规定客户端浏览器和服务端交互时数据的一个格式。SMTP 邮件传输协议,ftp:文件传输协议.
四、HTML的编辑工具(了解)
*.notepad 记事本
*.editplus : 语法高亮显示
技巧: 根据颜色判断单词是否出错。 (不是100%)
*.ultraedit : 根据颜色判断单词是否出错,可以显示2进制数据.
*.dw(dreamweaver,专业工具) 代码提示.
五、HTML的规范(知道)
*.HTML是一个弱势语言
*.html 不区分大小写
*.html页面的后缀名是html或者htm(有一些系统不支持后缀名长度超过3个字符,比如dos系统)
*.html 的结构
1)声明部分。主要作用是用来告诉浏览器这个页面使用的是那个标准。<!doctype html>是HTML5标准。
2)head部分: 不会显示在页面上。作用是告诉浏览器一些页面的额外信息。
3)body部分:我们缩写的代码必须放在此标签內。
六、HTML的各种标签(掌握)
明确:每个标签都有私有属性。也都有公有属性。
html中表示长度的单位都是像素。HTML只有一种单位就是像素。
body:
bgcolor: 背景颜色
background:背景图片
text: 文本颜色
1.排版标签
所有的浏览器默认情况下都会忽略空格和空行
P:p代表一个段落
属性: align:对齐方式. 取值:left,right,center
<br>代表是换行。
hr:
color: 线的颜色
size : 线的粗细
width: 线的长短
两种写法: 1) 绝对值 eg: 500
2) 相对值: 50%
noshade: 不要阴影
align: 对齐方式 取值: left,right,center
center: 内容居中
pre: 预定义格式标签 .告诉浏览器不要忽略空格和空行
div: 块级标签 必须单独占据一行
属性: align :
span: 块级标签 不换行字体标记
2 字体标签
h1...h6:定义字体大小
属性: align :居中
font:
color:字体颜色
颜色的写法有3种: 1)英文单词: red
2)十六进制:#00ffcc
3)RGB(三原色) : new RGB(124,156,23)
size:字体大小
face:字体类型
特殊字符: <小于 >大于 & &符号 " 双引号'单引号
© 版权 ™商标 空格
扩展:绐
b: 加粗
strong: 加粗
i:斜体
em: 斜体
u: 下划线
s: 中划线(删除线)
sup: 上标
sub: 下标.
3.图像标记
img: 代表是一副图片
属性: src : 图片的路径
两种写法:a) : 相对路径 路径是相对页面所在的路径 两个标记.和.. ,分表代表当前目录和父路径
b) :绝对路径
1) : 以盘符开始的路径
eg: C:\Documents and Settings\Administrator\桌面\day01_html\上课示例/images/1.jpg
2) : 网络路径
eg: http://www.baidu.com/images
width: 宽度
height:高度
Alt:当图片显示不出来的时候代替图片显示的内容
title: 提示性文本
border: 边框
热点: 就是特定的位置添加超链。
<img src="data:images/1.jpg" width="300" height="300" usemap="#Map" border="0" />
<map name="Map" id="Map">
<area shape="circle" coords="122,81,38" href="demo_字体标签.html" />
</map>
4.清单标记
列表标签:3种
a.无序列表ul
属性:type : 值: disc(默认,实心原点),square(实心方点),circle(空心圆)
b.有序列表(OL)
属性: type:取值:1(阿拉伯数字,默认),a,A,i,I
start: 从几开始
c.定义列表(dl)
dt: 列表项的标题
dd: 列表项
5.超链接
3种超链接:
1. 连接到其他页面
2. 锚: 指给超链接起一个名字,作用是连接到本页面或者其他页面的特定位置。使用name属性给超链起名字
3. 连接到邮件: <a href = "mailto:xugang@itcast.cn">进入我的邮箱</a>
属性:target: 告诉浏览器怎么显示目标页面
HTML中已定义4个值: _self :在同一个浏览器中显示
_blank: 打开新的浏览器显示
_parent: 在父窗口中显示
_top: 在顶级窗口中显示
6.表格标记
table: 表格
属性:border:边框
width:宽度
height:高度
align:表格的对齐方式
cellpadding:单元格内容到边的距离
cellspacing:单元格和单元格之间的距离
bgcolor:背景颜色
background:背景图片
bordercolorlight:表格的上,左边框,以及单元格的右,下边框的颜色
bordercolordark: 表格的右,下边框,以及单元格上,左的边框的颜色
dir:单元格内容的排列方式 取值:ltr 从左到右, rtl:从右到左
tr: 行
属性:dir:
bgcolor:
td: 单元格
属性: align: 内容的横向对齐方式
valign: 内容的纵向对齐方式 top,middle,bottom
width: 绝对值或者相对值(%)
height:单元格的高度
单元格的合并:
单元格的属性:
colspan: 横向合并
rowspan: 纵向合并
th: 相当于<td> + <b>
属性同<td>
caption: 表格的标题
属性:align: 取值:left,center,right,top,bottom
thead
tbody
tfoot
写与不写的区别:
1. 当表格非常大的时候,如果不写,则必须等表格的内容全部下载完成才能显示。但是用tbody标签的话,那么边下载边显示。 2.如果不写thead,tbody,tfoot那么浏览器解析表格内容的时候是从上到下解析。如果写了,那么顺序任意,浏览器解析的时候还是按照thead,tbody,tfoot的顺序显示内容
7.框架标记及<iframe>
框架页面上不允许有body标签
frameset: 框架的集合
rows: 纵向分部框架.
cols: 横向分部框架.
写法有两种: 1) 绝对值 "200,*" ,*代表剩余的
2) 相对值 "30%,*"
frame: 框架. 一个框架显示一个页面
scrolling: 是否需要滚动条。默认是true
noresize : 固定框架大小
bordercolor: 给框架边框起一个颜色
name : 给框架起一个名字
内嵌框架: 嵌入在一个页面上的框架.(仅仅IE支持)
iframe:
属性: width: 宽度
height: 高度
scrolling : 是否需要滚动条
8.表单标记及语义化
9.多媒体标记
bgsound: 背景音乐
embed: 播放多媒体文件.
marquee: 移动
属性:direction 移动目标方向 left,right ,up,down ,up,down移动距离是固定的200px
behavior: 行为方式 取值:slide,alternate,scroll
scrollamount : 移动速度
loop: 循环多少圈。负值表示无限循环
scrolldelay: 移动一次休息多长时间。单位是毫秒
10.头标记
HTML的学习笔记的更多相关文章
- 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 ...
随机推荐
- JS实现全选、不选、反选
思路:1.获取元素.2.用for循环历遍数组,把checkbox的checked设置为true即实现全选,把checkbox的checked设置为false即实现不选.3.通过if判断,如果check ...
- 手机端 图片的移动缩放旋转兼容touch
//缩放var initialScale = 1;var currentScale = 1;touch.on('#target', 'pinch', function (ev) { currentSc ...
- Log4Net不同日志类型写入到不同文件
1. 一直在用log4net,从来没有自己整理过.实践出真知,只有自己整理过才能真正掌握. 2. log4net,应该读logfornet,以前一直说log4,log4............ 安装 ...
- 配置一个完整的 applicacontext.xml
<?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.spr ...
- SQl server 2012安装问题 error code 0x858C001b 解决方法
英文版系统安装中文版sql server的缘故,改安装英文版即可.
- Chrome浏览器扩展开发系列之九:Chrome浏览器的chrome.alarms.* API
Chrome浏览器扩展程序通过chrome.alarms.* API,可以制定计划周期性地执行代码,或在指定时间执行代码. 要使用chrome.alarms.* API,首先需要在manifest.j ...
- Django学习(九)---Templates过滤器及Django shell和Admin增强
一.Templates过滤器 过滤器属于django模板语言 修改模板中的变量,从而显示不同内容 {{ value | filter }} 举例:{{ list_nums | length}} ...
- 用caffe一步一步实现人脸检测
学习深度学习已有一段时间了,总想着拿它做点什么,今天终于完成了一个基于caffe的人脸检测,这篇博文将告诉你怎样通过caffe一步步实现人脸检测.本文主要参考唐宇迪老师的教程,在这里感谢老师的辛勤付出 ...
- [Oracle]约束(constraint)
(一)约束的概念 在Oracle中,可以通过设置约束来防止无效数据进入表中.Oracle一共有5种约束: 主键约束(primary key) 外键约束(foreign key) 唯一性约束(uniqu ...
- linux文件系统及bash基础特性
linux文件系统 一.根文件系统 linux被识别的第一个被称为根之间关联的文件系统叫做根文件系统(rootfs),其他分区要想被读到,需要挂载到根目录的某个挂载点(根的子目录)上.根文件系统至关重 ...