【学习HTML(一)】

本文详细介绍了HTML的基础知识,包括HTML与浏览器的关系、标签结构、文本编辑、块级与行级标签的区别、语义化概念、XHTML1.0规范、常见块状结构的使用,以及超链接、表单元素、W3C标准等内容。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >


前言

提示:这里可以添加本文要记录的大概内容:

学习HTML网页基本知识。


提示:以下是本篇文章正文内容,下面案例可供参考

一、第一章 HTML

1)HTML是超文本标签语言,以及它简易性和跨平台的两个特点;HTML和浏览器之间的关系:解释和执行HTML语言的工具。
2)掌握HTML的基本结构,就如人体有头部和身体的部分一样

<html>
	<head></head>
	<body></body>
</html>

3)基本掌握用记事本和UE文本编辑器去编写HTML代码。
4)基本掌握了第一章所讲的所有标签,除标签的一些实际用法还有所有模糊,了解到块级标签和行级标签的区别。
5)初步了解到HTML语言的结构语义化、内容和表现分离的概念。
6)了解到 XHTML1.0的基本规范。
7)了解到四种块状结构所使用的场合

div-ul(ol)-li
div-dl-dt-dd
table-tr-td
form-table-tr-td

存在疑点:

1)<meta>标签里:http-equiv和name属性的用法
2)Content-Type,是否首字母一定大写(因为其他标签,属性小写)
3)<br/><br />中间空格的问题?
4)四种常用块级标签时,如:table-tr-td和form-table-tr-td不用前面加div
5)是否在设置样式的时候都必须写上style=" "
6)HTML页面元素的组织顺序?
7)多目标块级元素什么叫做终端形式出现和结构化形式出现?

一、选择题
1.(B) 2.(B) 3.(AC)
4.(ABCD) 5.(AB)
二、简答题
1)以某某商城首页为例,先将整个网页分为4大块,最上面一块是放网页横幅,表明主题是某某商城,里面还有首页,家用电器等等的无序列表作为菜单导航。
2)中间是一个商品陈列的信息大块,又分为两个小块,上面是图片,下面是6个图文混排的定义列表。
3)左边有商品全部分类一个大块,里面又从上往下包含家用电器、书籍、手机数码三个小块,三个小块里又包含若干无序列表块。
4)右边是包含公告栏和新品上架的一个大块,公告栏里是一张图片和一个无序列表,新品上架里是图片广告文字的一个无序列表。
5)整个组织顺序就是先将网页分为几个大区块,然后在每个区块里放若干小区块,小区块里就可以放别的小区快或者文字图片等等要表明的信息,整个网页的架构清晰分明、有条不紊。

2.html常用的四种块结构是:
div-dl-dt-dd 适合于图文混排,描述某事物信息
div-ul(ol)-li 适合于菜单导航
table-tr-td 适合于数据的规整显示
form-table-tr-td 常用于表单的一些布局

3、4、5题目多种方法实现之间的语义区别是:
1)第一种div-dl-dt-dd表明在网页中有一个div区块,里面有两个定义列表,定义两幅图片的信息。
2)第二种div-ul-li表明在网页中有一个div区块里面包含一个无序列表,里面有5项列表,不能说明文字与图片之间的关联。
3)第三种
实现,只是在网页中插入图片和文字通过
标签来换行实现,也不能够说明文字与图片之间的关联。

二、第二章-标签

1)理解如何使用<a>标签进行超链接图片、网页
<a herf="链接地址" target="目标窗口位置">文本或图像</a>
2)理解如何使用锚链接来链接到相同或不同页面的某一位置,其实就是给要链接的位置起个名字,然后来引用这个名字,还有功能性链接本机上所带的邮箱、QQ等程序
3)明白了注释的写法和作用<!--注释内容-->
4)了解一些特殊符号的写法和用法。例如:空格nbsp,@copy版权符号
5)了解了如何去创建一个菜单,用<form>标签用创建一个表单并提交
<form action="表单提交地址" method="提交方法">
	<!--文本框、按钮等表单元素-->
</form>
6)明白<input>标签常用的一些方法,了解到<input>元素的属性的作用。用<input>标签,通过设置它的type属性来更改<input>标签的功能和作用,type="text",它就是个文本框,type="button",它就是个普通按钮。
7)学习了下拉列表框,通过<select>标签来推明,这是一个下拉列表框,通过<option>标签来完成一个列表框的列表项以供选择,通过selected属性来提供一个默认的选择项目。
8)学习了多行文本框,也就是一个多行的文本框,通过<textarea>标签来实现,设置它的cols(列数),rows(行数)来实现这个多行文本框显示的大小。
9)明白表单元素的只读和禁用功能,通过readonly和disabled两个属性来实现。
10)了解了隐藏域hidden,也就是设置<input>标签的type属性来达到隐藏的功能。

一、选择题
1.(D) 2.(ACD) 3.(A)
4.(A) 5.(ABC)
二、简答题
1.超链接的类型有三种,有页面链接、锚链接、功能性链接,页面间链接是每个网页间的一个切换、链接、锚链接是插相同页面或者不同页面的某一个位置间的链接,功能性链接是链接本机自带的一些程序功能。比如邮件之类的,所以存在很大的差别。
2.客户端填写表单提交给服务器,服务器判断表单信息是否正确,如正确就响应客户端执行下一步动作或者发送给客户端所要请求的页面,如不正确就提示错误信息,让客户端重新填写表单。
B/S

三、第三章-块级标签

基本的块级标签:

1)标题标签<h1>~<h6>
2)段落标签 <p>
3)水平线标签 <hr/>

常用于布局的块级标签:

1)有序列表标签<ol>
2)无序列表标签<ul>
3)定义列表标签<dl>
4)表格标签<table>
5)表单标签<form>
6)分区标签<div>

在页面布局中,形成了如下四种常用的块状结构

div-ul(ol)-li:常用于分类导航或菜单等场合
div-dl-dt-dd:常用于图文混编场合
table-tr-td:常用于规整数据的显示场合
form-table-tr-td:常用于表单布局的场合

常用的行级标签:

1)图像标签<img/>
2)超链接标签<a>
3)范围标签<span>
4)换行标签<br/>
5)表单输入框标签<input/>
6)文本域标签<textarea>
7)图像标签<img/>	
语法如下:<img src="图片地址" alt="图像的替代文字" title="鼠标悬停提示文字" />
8)范围标签<span>
<span style='';font-size:;></span>
<span></span>标签限定某个范围;
style属性添加突出显示的样式

web开发方面常涉及的W3C标准如下:
1)HTML内容方面—XHTML
2)样式美化方面—CSS
3)结构文档访问方面—DOM
4)页面交互方面—ECMAScript
W3C提倡的Web结构如下:
1)内容(结构)和表现(样式)分离
2)HTML内容结构要求语义化

超链接的基本语法

<a href="链接地址" target="目标窗口位置" >链接文本或图像</a>
应用场合有如下三类:1.页面间链接。	2.锚链接。	3.功能性链接。

表单结构的基本语法

<form action="表单提交地址" method="提交方法"></form>
表单的基本格式:
<input name="" type="类型" value="" size="显示宽度" maxlength="能输入的最大字符长度" checked="是否被选中" />

表单元素:
1)文本框:text
2)密码框:password
3)重置、提交与普通按钮:reset、submit、button
4)单选按钮:radio
5)复选框:checkbox
6)文件域
7)下拉列表框<select> <option>
8)多行文本域<textarea>

语法

表单语法:

<form action="表单提交地址" method="提交方法">文本框、按钮等表单元素</form>

文本框语法:

<input name="名称" type="text" value="初值" size="数字">
eg:
	<input name="userName" type="text" size="21" />

密码框语法:

<input name="名称" type="password" value="初值" size="数字">
eg:
	<input name="pass" type="password" size="22" />

按钮语法:

<input name="名称" type="按钮类型" value="按钮文字" src=”图片按钮的图片url“>
eg
	<input name="reset" name="reset" value="重填" />
	<input name="submit" name="button" value="同意" />
	<input name="button" name="confirm" value="点播音乐" />
	<input name="button" name="cancel" value="取消" />
	<input name="image" src="image/login.gif" />

单选按钮语法:

<input name="组名" type="radio" value="..." checked="...">

复选框语法:

<input name="checkbox" name="..." value="..." checked="...">

文件域语法:

<input type="file" name="...">
eg:
	<p><input type="file" name="files" /><br/>
	   <input type="submit" name="upload" value="上传"/>
	</p>

列表框语法:

<select name="指定列表名称" size="行数">
	<option value="选项值" selected="selected">...</option>
</select>

多行文本框语法:

<textarea name="..." cols="列宽" rows="行宽">文本内容</textarea>

隐藏域语法:

<input type="hidden" name="..." value="..."/>
eg:
	<input type="hidden" name="userid" value="666"/>

总结

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值