如鹏网学习笔记(七)HTML基础
HTML笔记
一、HTML简介
1,HTML (Hyper Text Mark-up Language) 超文本标记语言,是一种编程语言,也可以说是一种标准、规范。
2,HTML提供了一系列标记(标签),每个标记都有不同的含义和作用,浏览器根据标记的含义把内容显示到浏览器页面上
3,超文本:页面不仅可以包含普通文本,还可以包含图片、链接、音乐、程序等非文本内容
4,学习HTML主要是学习常用标签的用法和语法规范
二、基本标签
<!DOCTYPE> 定义文档类型,表明该文档的类型和版本(了解)
<html> 定义 HTML 文档(页面)
<title> 定义文档的标题
<meta>定义文档的元数据,影响浏览器对页面的解析处理
<body> 定义文档的主体
<h1> ~ <h6> 定义 标题文本
<p> 定义段落文本
<br> 定义换行
<hr> 定义水平线
<!--...--> 定义注释
三、列表标签
1,无序列表
<ul> 在页面上显示一个无序列表(type属性决定图标样式)
<li> 表示一个列表项
2,有序列表
<ol>:在页面上显示一个有序列表(type属性:1 a A i I)
<li>:表示一个列表项
3,自定义列表
dl:在页面上显示一个自定义列表
dt:定义父节点列表项
dd:定义子节点列表项
注意:dt和dl不是嵌套关系,而是并列关系
四、语法规范
1,标签成对出现,有开始标签就需要有结束标签
2,标签不区分大小写,但建议使用小写
3,一对标签的内容可以为空、文本、或者其他标签(标签可以嵌套)
4,如果一对标签的内部总是为空,可以简写为单标记形式,如<br/>
5,两对标签不可以交叉
6,标签可以包含若干属性,属性之间使用空格隔开,属性之间没有顺序
7,一些标签需要配合使用,共同完成一件复杂的事情
8,浏览器把若干连续的空白字符(空格符、换行符、制表符)处理成一个空格的效果
注意:最开始为了尽快推广HTML,浏览器对HTML文档的语法要求并不严格,这导致那些不规范的HTML代码也会被浏览器正常解析
五、文本显示效果标签
在最开始的时候,HTML使用标签控制文本的显示效果,随着技术的发展,开始使用CSS语言控制页面的效果,
这些文本显示效果标签不再建议使用
<small>小号文本
<big>大号文本
<b>粗体文本
<i>斜体文本
<u>加下划线文本
<s>加删除线文本
<strike>加删除线文本
<center>居中文本
<em>强调文本
<strong>语气更为强烈的强调文本
<sup>上标文本
<sub>下表文本
<font>文本的字体、尺寸和颜色
六、HTML实体字符
在HTML中,有一些特殊字符,如 > < " & 具有特殊含义,在使用时容易造成冲突,另外 © ® × ÷ 等字符在键盘上没有对应的按键
为了方便开发者灵活使用这些字符,HTML提供了对应的实体字符供开发者使用
空格:
小于号 <
大于号 >
和号 &
双引号 "
注册商标 ®
乘号 ×
除号 ÷
七、表格标签
<table> 定义一个表格整体
<caption> 定义表格标题
<tr> 定义表格中的行
<td> 定义行中的单元格(colspan、rowspan 属性可以合并单元格)
<thead> 表头
<th> 定义表格中的表头单元格
<tbody> 表格主体,可用于大表格分段显示优化
<tfoot> 表格的脚注
表格单像素边框效果 <table border="1" cellspacing="0px" style="border-collapse: collapse">
八、超链接标签<a>
1,链接到外部资源:
<a href="http://www.rupeng.com/index.shtml">如鹏网</a>
<a href="人丑就要多读书.jpg">人丑就要多读书.jpg</a>
<a href="人丑就要多读书.zip">人丑就要多读书.zip</a>
超链接只是指定资源的位置,浏览器在获得这些资源后处理时,默认的,如果浏览器可以解析显示,浏览器就会直接解析显示,
否则,就以文件下载的方式处理(当然,也可以指定强制下载)
target属性:指定打开资源的位置(_self、_blank)
2,连接到页面内的另一个<a>标签
<a name = "mao">定义一个位置(锚)</a>
<a href="#mao">指定这个位置</a>
九、图片标签<img>
1,用来在页面上显示一个图片
<img src="人丑就要多读书.jpg" alt="图片未找到"/>
src 属性:指定图片资源位置
alt 属性:当找不到src指定的图片资源时,显示在浏览器上的说明提示
width、height属性 :指定图片显示的宽、高
border:指定图片边框的宽度
注意:src的值尽量写资源的相对路径,因为很多浏览器这里不支持绝对路径
十、表单标签
<form> 用来定义供用户输入信息的表单,收集用户信息
<input> 可以定义多种输入控件,
有:text、password、radio、checkbox、file、hidden、button、submit、reset
<label> 定义 表单控件的标注
<textarea> 定义多行的文本输入控件
<select> 定义下拉列表 、<option> 定义下拉列表的选项
<button> 定义普通按钮
(在输入框中按回车键和点击submit按钮效果相同)
十一、框架标签
1,<frameset>,<frame>定义框架集(已过时)
<html>
<head></head>
<frameset rows="100px,*">
<frame src="head.html"/>
<frameset cols="20%,*">
<frame src="left.html"/>
<frame src="main.html"/>
</frameset>
</frameset>
</html>
2,<iframe>定义内嵌框架
<iframe src="inner.html" width="600px" height="370px"></iframe>
十二、页面布局标签<div>、<span>
<div>(division)和<span>都可以把页面分成相对独立的各个部分(分区),方便布局
不同之处在于div默认有换行效果,而span则没有
div+css 布局方式是现在的主流,具体将在css课程中讲解
现在有种共识,网页内容要和表现形式分离,也就是说html标签主要负责定义网页的内容,
如一段文本,css负责定义这些内容的显示样式,如文本的颜色
如鹏网学习笔记(七)HTML基础的更多相关文章
- 如鹏网学习笔记(十五)ASP.NET MVC核心基础笔记
一.ASP.Net MVC简介 1,什么是ASP.NET MVC? HttpHandler是ASP.net的底层机制,如果直接使用HttpHandler进行开发难度比较大.工作量大.因此提供了ASP. ...
- 如鹏网学习笔记(四).Net常用类库
.Net常用类库 一.String成员方法(常用) 1,bool Contains(string str) 判断字符串对象是否包含给定的内容 2,bool StartsWith(String str) ...
- 如鹏网学习笔记(五)MySql基础
MySQL基础 一.数据库概念 1,网友装备信息.论坛帖子信息.QQ好友关系信息.学籍管理系统中的学生信息等都要“持久化”的保存到一个地方, 如果通过IO写到文件中,那么会非常麻烦,而且不利于多人共享 ...
- 如鹏网学习笔记(六)ADO.Net基础
ADO.Net基础 一.ADO.Net简介 1,程序要通过SQL语句自动化的操作数据库,必须要用一个类库, 类库要提供execute("insert into ...")/exec ...
- 如鹏网学习笔记(十)DOM
DOM笔记一.DOM简介 Document Object Model 文档对象模型 DOM的节点树模型:整个文档按照从大到小的节点划分,每一个内容都算作一个节点 DOM API 编程接口 可以用来操作 ...
- 如鹏网学习笔记(九)JavaScript
JavaScript笔记 一.JavaScript简介 1,JavaScript是一种计算机编程语言,可以像等其他编程语言那样定义变量,执行循环等. 2,JavaScript代码主要执行在浏览器上,为 ...
- Java基础学习笔记七 Java基础语法之继承和抽象类
继承 继承的概念 在现实生活中,继承一般指的是子女继承父辈的财产.在程序中,继承描述的是事物之间的所属关系,通过继承可以使多种事物之间形成一种关系体系. 例如公司中的研发部员工和维护部员工都属于员工, ...
- 如鹏网学习笔记(十四)ASP.NET
Asp.net笔记 一.Socket类 进行网络编程的类,可以在两台计算机之间进行网络通讯 过程: 向服务器发送指令: GET /index.html HTTP/1.1 Host:127.0.0.1: ...
- 如鹏网学习笔记(十三)EasyUI
一.EasyUI简介 是一组基于JQuery的UI插件集合 主要作用:为JQuery对象提供新的方法,实现新的功能 可以快速创建出简洁.友好.美观的页面,非常适合做网站后台管理页面(不够漂亮,不适合做 ...
随机推荐
- JavaScript多个音频audio标签,点击其中一个播放时,其他的停止播放
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- C# 未安装Office环境下使用NPOI导出Excel文件
1.NuGet直接安装NPOI程序包: 2. using NPOI.XSSF.UserModel; 3.导出Excel代码: private void TsbExport2ExcelClick(obj ...
- Ajax请求的参数
post请求和get请求存放参数位置 post请求和get请求存放参数位置是不同的: post方式参数存放在请求数据包的消息体中. get方式参数存放在请求数据包的请求行的URI字段中,以?开始以pa ...
- [VB6.0-->VB.NET]关于VB6.0升级到VB.NET的微软官方文档
升级流程大体是这样的: 1.用VS2008打开Vb6.0的工程(此时针对语言层面自动升级). 注: VS更新多版了(当前最新VS2017),用最新版再打开2008升级后的工程的时候还是会有自动升级,相 ...
- MySql环境变量配置
配置环境变量 前面步骤完成后安装好MySQL,为MySQL配置环境变量.MySQL默认安装在C:\Program Files下. 1)新建MYSQL_HOME变量,并配置:C:\Program Fil ...
- Spring注解大全,汇总版
Spring使用的注解大全和解释 注解 解释 @Controller 组合注解(组合了@Component注解),应用在MVC层(控制层),DispatcherServlet会自动扫描注解了此注解的类 ...
- Description &&debugDescription && runtime(debug模式下调试model)
description 在开发过程中, 往往会有很多的model来装载属性. 而在开发期间经常会进行调试查看model里的属性值是否正确. 那么问题来了, 在objective-c里使用NSLog(& ...
- NSObject 中执行Selector 的相关方法
1. 对当前Run Loop中Selector Sources的取消 NSObject中的performSelector:withObject:afterDelay:方法将会在当前线程的Run Loo ...
- 架构师养成记--23.sigar使用实例
作用是检测机器的硬件环境 注意在jdk的bin目录下加上sigar的lib目录中的文件 import java.net.InetAddress; import java.net.UnknownHost ...
- CUDA安装
1.CUDA是什么? CUDA(Compute Unified Device Architecture),显卡厂商NVidia推出的运算平台. 随着显卡的发展,GPU越来越强大,而且GPU为显示图像做 ...