HTML 入门第一课
HTML 简单认识
HTML(HyperText Markup Language)即超文本标记语言,是一种用来制作超文本文档的简单标记语言,也是制作网页的最基本的语言,它可以直接由浏览器执行。
1.HTML 是用来描述网页的一种语言。
2.HTML 指的是超文本标记语言: HyperText Markup Language
3.HTML 不是一种编程语言,而是一种标记语言
4.标记语言是一套标记标签 (markup tag)
5.HTML 使用标记标签来描述网页
6.HTML 文档包含了HTML 标签及文本内容
7.HTML文档也叫做 web 页面
由 HTML 组成的网页的基本结构
文档类型声明 <!DOCTYPE html> --这是html5的声明方法
头部标记(<head>….</head>)
包含文档的标题信息,头部标记都不可或缺!
主体标记(<body>…..</body>)
包含了文档的内容
中文编码声明(<meta charset = “utf-8”>)
HTML常用标签
<p>…</p> 定义一个段的块级标记 | <br /> 换行标记 | <h1> …<h6> 标题标记
<ul> </ ul> 无序列表标记,表示列表所包含的项是没有先后顺序的!列表项使用<li>表示。
<ol> </ ol> 有序列表标记,表示列表所包含的项是有先后顺序的!列表项使用<li>表示。
<dl> </ dl> 定义列表,定义列表至少包含一条术语(dt)或一条说明(dd)
<dt> </ dt> 标明一个术语要说明的对象
<dd> </dd> 列表项说明
<b> </b> 或 <strong> </strong> 文本加粗
<i> </i> 或 <em> </em> 文本倾斜
<div> </div> 块级元素 | <span> </ span> 行内元素 | <hr /> 分隔线 | <del> <del /> 删除线
< img > 图像的行内标记
<img src = “lianhua.jpg ” alt = “莲花之美”>
src 是图片的路径参数;
网页设计中的所有文件,原则上都必须放置在一起,即在同一个文件夹下(这个文件夹是网页的“根”文件夹)
相对路径:参照自身的位置,而定义的路径,叫做相对路径
相对路径有三种表示方法:
1.Html文档和图片在同一个目录下,直接写图片名称
2.Html文档和图片所在的文件夹在同一个目录下,先写文件夹名称,再写图片名称
3.Html文档所在文件夹和图片所在文件夹在同一个目录下,则需要先用”../ ”找到根目录,
再写图片所在文件夹的名称,最后写图片名称
-> 图片大小 <img width = “ ” height = “ “ />
网页中长度单位多使用 px ,即像素。
-> 图标替代文体 <img alt = “图片替代的文本内容” />
在网络较慢的环境中,如果没有出现图片,将以文本替代图片显示
-> 图片提示 <img title = “提示文本” />
在鼠标放置图片上时提示的文本。多数标签都有此属性,但浏览器的支持不全面!
HTML 文字排版标记
1.<big></big> 定义大字体的文字 不符合标准网页设计的理念,不赞成使用.
2.<small></small> 定义小字体的文字
3.<sup></sup> 上标
4.<sub></sub> 下标
HTML 特殊符号
“<” 和 >” “<” 和 “>” | « » << >>
‹ › < > | © 版权 & &
超链接
<a> </a> 通过使用属性href来指定要链接的url,标签的内容可以为文本也可为其他标签
①<a href="2.html">点击进入2网页</a>,点击文字进入2.html
②<a href="2.html"><img src="two.jpg" /></a>,点击图片进入2.html
① a:link:未访问链接 ,如 a:link {color:blue}
② a:visited:已访问链接 ,如 a:visited{color:blue}
③ a:active:激活时(链接获得焦点时)链接的颜色 ,如a:active{color:blue}
④ a:hover:鼠标移到链接上时 ,如 a:hover {color:blue}
锚点的使用
1.定义锚点<a id=“zj”>第三章</a>
2.定义指向该锚地的链接<a href=“#zj”>点击查看第三章</a>
下载链接的使用
如果url指向的不是一个html文件,那么点击时将下载该文件
表格的基本结构
1)<table> </ table> 定义表格的基本框架
2)<tr> </tr> 定义表格的行
3)<td> </td> 定义表格行内单元格
4)<th> </th> 定义表格行内单元格(标题),自动将文本加粗,居中对齐
表单
表单的组成:一个表单有三个基本组成部分:
1)表单标签:这里面包含了处理表单数据所用程序的url,以及数据提交到数据服务器的方法。
2)表单域:包含了文本框,密码框,隐藏域,多行文本框,复选框,下拉框和文件上传框等。
HTML 入门第一课的更多相关文章
- Asp.Net Web API 2(入门)第一课
Asp.Net Web API 2(入门)第一课 前言 Http不仅仅服务于Web Pages.它也是一个创建展示服务和数据的API的强大平台.Http是简单的.灵活的.无处不在的.你能想象到几乎 ...
- emacs 入门第一课:Emacs里的基本概念
Table of Contents 无聊的开场白 buffer(缓冲区) window(窗口)与frame Emacs的mode Emacs Lisp 函数function.命令command.键绑定 ...
- Android入门第一课之Java基础
通知:由于本周六场地申请没通过,所以本周的培训临时取消. 今天给大家带来的是Android入门的第一课,由于教室申请的不确定性,因此,每次培训的内容都会在博客先提前释放出来.首先Android的APP ...
- Docker入门 第一课 --.Net Core 使用Docker全程记录
微服务架构无疑是当前最火热的开发架构,而Docker作为微服务架构的首选工具,是我们必须要了解掌握的. 我通过一天的时间,网上查文档,了解基础概念,安装Docker,试验Docker命令,通过Dock ...
- Kotlin入门第一课:从对比Java开始
1. 介绍 今年初,甲骨文再次对谷歌所谓的安卓侵权使用Java提起诉讼,要求后者赔偿高达90亿美元.随后便传出谷歌因此计划将主力语言切换到苹果主导的Swift,不过这事后来没了跟进. 但谷歌在这两天的 ...
- Spring入门第一课:Spring基础与配置Bean
1.入门 Spring是简化java开发的一个框架,其中IoC和AOP是Spring的两个重要核心.由于Spring是非侵入性的,通过Ioc容器来管理bean的生命周期,还整合了许多其他的优秀框架,所 ...
- JavaScrip 入门第一课
一.代码引入的三种方式 1.直接在head中书写 在head标签里面可以写,在body标签里面也可以写,放到head标签里面和放到body标签里面到底有什么区别,我们后续在讲~ <head> ...
- python 语言学入门第一课必看:编码规范
命名 module_name, package_name, ClassName, method_name, ExceptionName, function_name, GLOBAL_VAR_NAME, ...
- 1、C#入门第一课
C# 读作C Sharp,所以程序文件的扩展名为.cs 新建项目-窗体应用程序 所谓的Visual C#就是指的可视化编程,主要在设计窗口布置好自己的控件(一些具有一定功能的小部件,例如如可以点击的按 ...
- Android 入门第一课 一个简单的提示框
1.打开Android开发环境Eclipse来到主界面 2.新建一个安卓项目 File->New->Android Application project 在上面有红色错误的地方填上应用程 ...
随机推荐
- OpenCV的视频读取
现在找一个能拍摄视频的设备真是太容易了.结果大家都用视频来代替以前的序列图像.视频可能由两种形式得到,一个是像网络摄像头那样实时视频流,或者由其他设备产生的压缩编码后的视频文件.幸运的是,OpenCV ...
- Redis Distributed lock
using StackExchange.Redis; using System; using System.Collections.Generic; using System.Linq; using ...
- Educational Codeforces Round 82 (Rated for Div. 2)D(模拟)
从低位到高位枚举,当前位没有就去高位找到有的将其一步步拆分,当前位多余的合并到更高一位 #define HAVE_STRUCT_TIMESPEC #include<bits/stdc++.h&g ...
- 画图软件gliffy
网上的资源真是海量丫: https://segmentfault.com/q/1010000000310976 gliffy软件在线网址:https://chrome.google.com/webst ...
- Redis非关系型缓存数据库集群部署、参数、命令工具
<关系型数据库与非关系型数据库> 关系数据库:mysql.oracle.DB2.SQL Server非关系数据库:Redis(缓存数据库).MongodDB(处理海量数据).Memcach ...
- MS Sqlserver删除字段最后的多余字符
存在这样一些数据 ,,,,dga bc,,aaaa,,,,,,,,dga bc,,aaaa,,,,,,,dga bc,,aaaa,,,,,,,dga bc,,aaaa,,,,,, 需要将最后多余的逗号 ...
- Python 字符串格式化操作 - format方法
建议使用format()方法 字符串操作 对于 %, 官方以及给出这种格式化操作已经过时,在 Python 的未来版本中可能会消失. 在新代码中使用新的字符串格式.因此推荐大家使用format()来替 ...
- VIM学习(转)
原文:http://www.cnblogs.com/nerxious/archive/2012/12/21/2827303.html 断断续续的使用VIM也一年了,会的始终都是那么几个命令,效率极低 ...
- 计算几何-Line-Left-Intersect
This article is made by Jason-Cow.Welcome to reprint.But please post the article's address. 好好领悟一下ve ...
- 16进制 32进制 base64之间的区别
Base64: 包含大写字母(A-Z),小写字母(a-z),数字(0-9)以及+/; Base32: 而Base32中只有大写字母(A-Z)和数字234567: Base16: 而Base16就是16 ...