html基础

鱼樱、、      2022-02-09     732

关键词:

一、图像 <img />【重点】
标签的属性
<img src="图片路径URL"/ height="高度" width="宽度" alt="图片说明" title/>
图像可以是GIF,PNG,JPEG,JPG,webp格式的图像文件
jpg jpeg格式兼容性好
webp格式Google推出的 主流浏览器不兼容
src必要属性
最主要的部分是路径【重点】
绝对路径 如:<img src="http://www.a.com/img/a-next.jpg"/ >
相对路径 如:<img src="../img/a-next.jpg" />
根相对路径 如:<img src="/img/a-next.jpg" />
href 是指向网络资源所在的位置,建立和当前元素(锚点)或当前文档之间的链接 用于超链接
src 是指向外部资源的位置,指向的内容会嵌入到文档中当前标签所在的位置

二、表格
在HTML语言中,表格至少由<TABLE>标签、<TR>标签和<TD>标签这3对标签组成
1、表格组成标签【重点】
table 表格
tr 表格行 table row
td 单元格 table data cell
caption 表格标题
th 标题单元格 table header
scope 属性定义将表格中表头单元与数据单元相关联的方法。
scope 属性标识某个单元是否是列、行、列组或行组的表头。
2、表格的结构
在使用表格进行布局时,可以将表格划分为头部、主体和页脚,具体 如下所示:
<thead></thead>:用于定义表格的头部,必须位于<table></table>标记中,一般包含网页的logo和导航等头部信息。
<tfoot></ tfoot >:用于定义表格的页脚,位于<table></table>标记中<thead></thead>标记之后,一般包含网页底部的企业信息等。
<tbody></tbody>:用于定义表格的主体,位于<table></table>标记中<tfoot></ tfoot >标记之后,一般包含网页中除头部和底部之外的其他内容。
3、属性:Border Cellspacing Cellpadding Width Height Align bgcolor
4、合并单元格
rowspan 单元所占行数 rowspan="2"两行转为一行(自上向下合并)
colspan 单元所占列数 colspan="2"两列转为一列(从左到右合并)
colspan="3" 合并列
rowspan="3" 合并行
合并方向是:
从左到右
自上而下
【注意】
右边和下面没有单元格时不进行合并操作
要删除被合并的单元格
合并单元格的方向

三、表单【重点】
1、语法:
<form name="form_name" action="url" method="get|post">…</form>
Name :定义表单的名称
Method: 定义表单结果从浏览器传送到服务器的方式,默认参数为:get ;
Action :用来指定表单处理程序的位置(服务器端脚本处理程序)
2、input控件
type属性规定 input 元素的类型。
以下是type的常用属性值:
文本text placeholder="规定帮助用户填写输入字段的提示"
密码框 password
按钮button value属性
单选radio name属性(需要这个属性才可以进行单选)
复选checkbox
上传文件 file
重置reset
提交submit
图片 image
3、html5中的Input新type属性
email 邮件
number 数字
range 选择范围
date, month, week, time, datetime, datetime-local
日期 月 星期 时间 日期时间 当地的日期时间
color 颜色
4、label扩大选择区域
5、属性:name value readonly checked placeholder maxlength
textarea控件
如果需要输入大量的信息,就需要用到<textarea></textarea>标记。通过textarea控件可以轻松地创建多行文本输入框,其基本语法格式如下:
select控件
在HTML中,要想制作如下图所示的下拉菜单,就需要使用select控件
input
datalist 既可输入又可选择
6、<form name="form_name" action="url" method="get|post">…</form>

四、标签补充【了解】
1、<pre>...</pre>预格式文本,空格 tab缩进都可以显示(常见应用就是用来表示计算机的源代码)
转义字符
&nbsp; 空格
&gt; 大于号(>)
&lt;小于号(<)
<blockquote>...</blockquote> 长文本引用,上下会换行,且两边都有缩进(有外边距)
<q>...</q> 短文本引用,两边有引号(我们编码时会用到“”要使得“”显示出来就可以用这个标签)
<base href="" target="_blank" /> 定义了页面链接标签的默认链接地址
2、<meta/>
<meta name="keywords" content="" /> 为搜素引擎定义关键字
<meta name="description" content="" /> 为网页定义描述内容
<meta name="author" content="" /> 定义网页作者
<meta http-equiv="refresh" content="30" /> 每30秒钟刷新当前页面
结构性区域标签补充
<figure>...</figure> 定义图像区域,两边有缩进(外边距)
<figcaption>...</figcaption> 定义图像区域的标题
狂拽炫酷吊炸天的HTML5新标签:
<audio>...</audio> controls如果出现该属性,则向用户显示控件,比如播放按钮。可以直接添加音频
<video>...</video> 尝试
<source/> 设置新的媒体源(兼容性做法)
html5中特殊的媒体元素标签
video:在HTML5中专门用来播放网络上的视频或者电影
audio:在HTML5中专门用来播放网络上的音频
用src属性
source元素指定多个播放格式与编码
<video controls="controls">
<source src="viedo.m4v" type="video/mp4" />
<source src="viedo.webm" type="video/webm" />
<source src="viedo.ogg" type="video/ogg" />
<source src="viedo.mp4" />
</video>
preload 这个属性指定是否对数据进行强加载,如果是的话浏览器会将视频数据或者音频数据进行缓冲这样做可以加快播放的进度。
none
metadata
auto
poster="图片"













































































































web开发基础(html基础)

网页的标准是W3C,目前模式是HTML、CSS和JavaScript。HTML,全称“HyperTextMarkupLanguage(超文本标记语言)”,简单来说,网页就是用HTML语言制作的。HTML是一门描述性语言,是一门非常容易入门的语言CSS,全称“(层叠样式表)”。... 查看详情

html文档基础

...行编译和运行才干正确显示。此篇文章主要介绍HTML文档基础和经常使用标记,此篇文章的内容框架例如以下,可是仅仅先介绍HTML文档基础:上图在HTML文档的经常使用标记中。少画了一个多媒体标记,请见谅!1.HTML文档基础:1.1... 查看详情

html基础

讲解html得常用基础知识,建议阅读时间10分钟 html基本概念:HTML是用来描述网页的一种语言。HTML指的是超文本标记语言(HyperTextMarkupLanguage)HTML不是一种编程语言,而是一种标记语言(markuplanguage)标记语言是一套标记标签(markupta... 查看详情

html基础html(代码片段)

查看详情

html基础html(代码片段)

查看详情

html基础

概述什么是HTML?HyperTextMarkupLanguage(超文本标记语言)简答的来说HTML就是一组浏览器能够识别的标签,是我们和浏览器沟通的必不可少的一种语言; 查看详情

html基础知识

基础语法HTML基础语法  HTML文档的后缀一般都是.html,但是在以前,.htm后缀也是不少的,它们都代表html文档,实际上也没有本质的区别。htm是在win32时代,系统只能识别3位扩展名时使用的。现在一般都使用.html 概念  (Hyp... 查看详情

html基础

1HTML概述23超文本标记语言(HyperTextMarkupLanguage)4HTML文档是一个包含标记的文本文件5文件名以.htm或者.html结尾67------------------------------------------------------------------------------89文档结构1011为了使浏览器能正确渲染页面,我们需要告... 查看详情

html基础

html基础HTML是一种相当简单的、由不同元素组成的标记语言,它可用于表示文本片段,使文本在文档中具有不同的含义(段落、项目列表、表格),将文档结构化为逻辑块(头部、主体、导航菜单),并且可以将图片,影像等内... 查看详情

##html基础

HTML基础 一:基础  HTML(HyperTextMarkupLanguage):超文本标记语言  目前学习最新的版本:HTML5.  优点:1,智能代码补全2,代码提示3,自动保存4,多个浏览器支持   用来表达网页而用来编辑的程序:nootpad,写字... 查看详情

html--基础标签

...知识如果没有总结总觉得没有掌握,刚好周末回顾总结下基础知识。第一部分:HTML初始  1.什么是HTML?    HTML指的是超文本标记语言(HyperTextMarkupLanguage),是由一套标记标签组成的标记语言,用于描述、构造网页。  2.H... 查看详情

html基础

HTML部分基础展示:排版标记<html><head><title>排版标记</title><!--网页的属性:改变页面的解析码表--><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"></head><body><!-- 查看详情

html基础(代码片段)

1.html基础  html文件的后缀名为.html或.htm。  HTML是用来描述网页的一种语言。    HTML指的是超文本标记语言:HyperTextMarkupLanguage    HTML不是一种编程语言,而是一种标记语言    标记语言是一套标记标签(markuptag)... 查看详情

html基础知识

HTML基础知识:Html:超文本标记语言超文本:超出文本的范畴,使用HTML可以很好的处理标记:HTML所有的操作都是通过标记来实现的,标记即标签网络语言:浏览网页时的界面HTML的规范:1.一个HTML文件一个开始标签,一个结束标... 查看详情

html基础

HTML基础  今天开始就进入到前端的整理和总结了。一、HTML的概念性知识html是 htypertextmarkuplanguage即超文本标记语言,超文本就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素,而标记语言:即标记(标... 查看详情

html入门基础

一、HTML的介绍1.什么是HTML?HTML指的是超文本标记语言:HyperTextMarkupLanguage。HTML不是一种编程语言,而是一种标记语言。HTML使用标记标签来描述网页。2.网页结构可以使用HTML来建立自己的WEB站点。网页主要由3个部分组成:HTML:结... 查看详情

html基础

HTML简介超文本标记语言(英语:HyperTextMarkupLanguage,简称:HTML)是一种用于创建网页的标准标记语言。规则学习<!DOCTYPEhtml>  #文档类型说明<htmllang="en">  #html标签,伴随着/html结束标签#id="i1":标签的属性<headid="i1"&... 查看详情

学习笔记html基础:使用html制作网页

... HTML(HyperTextMarkupLanguage)超文本标记语言是创建Web页面的基础,HTML由一套标记标签(MarkupTag)组成,在制作网页时,HTML使用标记标 查看详情