HTML基础知识

举报
Laura_张 发表于 2022/08/27 00:04:43 2022/08/27
873 0 0
【摘要】 文章目录 前言各种标签与段落显示相关的标签与文本显示相关的标签输入特殊字符 HTML注释列表建立数字编号的列表指定编号的格式和顺序建立带有项目符号的列表建立无符号的列表建立术语列表 ...


查看更多关于HTML的详细内容

网页文档的结构和格式的定义都是由HTML完成的,HTML元素由单一或者一对标签定义的包含范围,一个标签的左右分别有一个< >的字符串。开始时是<> 结束的时候是</>

前言

一般一个HTML的框架有开始,头部,标题,主体内容,可以不写框架,直接写输出的内容,这样在浏览器也可以输出。
在这里插入图片描述

注意:

标签的属性是可以选择的,可以不写。
给一个标签的属性赋值时,可以加双引号,也可以不加。
标签属性与大小写无关。

各种标签

与段落显示相关的标签

多个空格,浏览器只会读取一个,所以使用各种标签来表示格式。

<p align="#">作用:创建一个段落,属性align表示段的对齐方式,# 可以是left,center,right,justify

<br>表示line,break,作用是换行

<hr color="clr">作用是插入一条水平线,属性color用来指定线的颜色,clr可以是颜色名字。

在这里插入图片描述

与文本显示相关的标签

<center> </center>是文本居中显示

<hn align="#"> </hn> 用于指出文档的标题,n是从1到6的整数,一共有六档标题。align用来设置标题对齐的方式,可以是center,right,left。

<font size=n color="clr"> </font>用来设置字体,size表示字体大小,color是字体的颜色。

<b> </b>文本为粗体

<i> </i>文本为斜体。

在这里插入图片描述

输入特殊字符

有些特殊字符在HTML中无法正常显示,需要引用的方式才能输入。

HTML中的两种引用类型:字符引用和实体引用,都是一个和好(&)开始以一个分号(;)结束。

如果是字符引用,需要在和号后面加一个井号(#)之后是所需字符的十进制代码或者十六进制代码;如果用的是实体引用,在和号后面加上字符的助记符。
在这里插入图片描述

HTML注释

<!-- 需要注释的内容-->

列表

建立数字编号的列表

使用<ol><li>标签创建带数字编号的列表

<ol>标签中使用start属性,设置起始的序号。

<li>标签中使用value属性,改变列表内的编号顺序。

指定编号的格式和顺序

<ol> <li>标签中,使用type属性指定编号系统的类型,type的取值
在这里插入图片描述

建立带有项目符号的列表

使用<ul> <li>标签创建带有项目符号的列表,type属性指定符号的样式,取值如下:
在这里插入图片描述

建立无符号的列表

使用<dl> <dt>标签创建无符号的列表。

使用<dd> 标签替换<dt>,创建缩进的列表。

建立术语列表

<dl>元素中同时使用<dt><dd>标签,建立术语列表。

术语列表中的列表项由两部分组成:术语和它的说明。

术语由<dt>标签指定,说明由<dd>标签指定。

表格

在这里插入图片描述

定义表格

表格用<table>元素来定义,

<table border =n align="alignment" bgcolor="clr">  </table>

border属性是定义表格边框的宽度,align属性设定表格的对齐方式,alignment可以是left,center,right。bgcolor是指定表格的背景色

<caption> </caption>元素用来定义表格的标题,

<tr align ="alignment" valign="alignment"> </tr>属性align用来指定这一行在水平方向上的对齐方式,alignment可以是left center right,valign用来指定这一行在垂直方向上的对齐方式,alignment可以是top middle bottom

<th> </th>元素用来定义表头

<td> </td>用来定义单元格。
在这里插入图片描述

HTML交互式表单

在这里插入图片描述

浏览器提交表单与服务器的交互过程

在这里插入图片描述

创建表单

使用<form>元素,以及在其中嵌入的相关元素,就可以创建表单。

<form method="get or post" action="URL">
……
</form>

属性mothod指定向服务器发送表单数据时使用的http方法,可以使get或者是post两种方法中的一种,get是缺省的方法,采用get方法提交表单时,提交的数据被附加到URL的末端,作为URL的一部分发送到服务器端。post是将表单中的信息作为一个数据块发送到服务器端,无论采用那种方法,数据的编码都是相同的。

属性action指定对表单进行处理的脚本的地址,表单提交到服务器之后,交给谁来处理,在action属性中指定处理者的URL。

input元素

<input>元素用来接受用户输入的信息,是一个带有属性的空元素,用来创建表单中的控件

<input type="type" name="name" size="size" value="value">

type是指定要创建的控件的类型,name是指定控件的名称,处理表单的服务器端脚本可以获得以名称-值对所表示的表单数据,利用名称,可以取出对应的值,name的属性在表单中并不显示,属性size是指定表单中的控件的初始宽度,value指定控件的初始值。
在这里插入图片描述

列表框

列表框允许用户从一个下拉框中选择一项或者多项

列表框由<select>元素创建,列表框中的各个选项用<option>元素提供。

多行文本输入控件

<textarea name="name" rows="number of rows" cols="number of columns">  </textarea>

创建多行文本输入控件的语法:

rows指定文本输入控件可视区域显示的文本行数,cols指定文本输入控件可视区域显示的宽度,在开始标签和结束标签之间出现的文本,将作为文本输入控件中的初始文本显示。

超链接

建立一个超链接的语法:

<a href="URL>  </a>

href指定连接的目标,目标地址由URL定位,在开始标签和结束标签之间输入的文本将作为浏览器中显示的连接文本。

嵌入图像

web上使用的图像格式为GIF和JPEG,GIF只能用256色的图像,对于不需要使用大量颜色的图片,使用GIF,对图片品质要求高一些的图像,使用JPEG格式。

网页中嵌入一幅图像使用<img>元素,语法格式:

<img src="URL" width=n height=n>

src指定图像资源的位置,属性width和height用于指定图片的尺寸。
在这里插入图片描述

感谢阅读~

文章来源: blog.csdn.net,作者:张艳伟_Laura,版权归原作者所有,如需转载,请联系作者。

原文链接:blog.csdn.net/Laura__zhang/article/details/115275932

【版权声明】本文为华为云社区用户转载文章,如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

作者其他文章

评论(0

抱歉,系统识别当前为高风险访问,暂不支持该操作

    全部回复

    上滑加载中

    设置昵称

    在此一键设置昵称,即可参与社区互动!

    *长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

    *长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。