一、什么是HTML
超文本标记语言,不是一种编程语言,而是一种标记语言,描述网页的语言,HTML使用标签描述网页中图片、文本、音乐、视频、超链接等。
二、常用标签
1、标题标签 <h1>一级标题</h1> 1-6 2、段落标签<p>段落</p> 会换行,比 换行的间距大 3、水平线标签<hr> color:设置水平线的颜色 width: 设置水平线的宽度,值可以是像数值,也可以是百分比(使用浏览器宽度的百分比) size: 设置水平线的粗细 align:设置水平线的对齐方式align:设置水平线的对齐方式,常用值有Left(左对齐)、center(居中对齐、默认值)、right(右对齐) -->
4、斜体 加粗 斜体
<strong>加粗<strong> <b>加粗<b>
二者的不同是:<b>是物理元素 ;<strong>是逻辑元素。 物理元素强调的是一种物理行为。 比如说,把一段文字用b加粗,意思是告诉浏览器应该加粗显示,没有其他作用。 而<strong>可以从字面理解知道它是强调的意思,<strong>是逻辑标签,强调文档逻辑。 -->
5、图像标签 <img >img 图像标签 单标签
src属性:设置图像的路径,可以是相对路径,也可以是绝对路径 width属性:图像的宽度 height:设置图像的高度,一般来说宽度和高度只需要设置一个 title属性:设置鼠标悬停在图像上时显示的内容 alt属性:当图像不能正常加载显示的时候,显示alt属性值内容对图像进行显示 -->
6、超链接标签 <a><!-- a 超链接标签 target属性 _self默认在当前窗口打开 _black在新的窗口打开 -->
<!-- 锚链接 在某一个地方使用id属性或者name属性来标定一个位置 在href后面写一个#再写锚的id 或name的值,就表示要跳转到的位置 -->
三、列表
<body>
<!-- 无序列表 -->
<!-- type 设置ul标签的列表项的符号
= disc 默认 黑色实心圆
= circle 黑色空心圆
=square 方形实心圆 -->
<ul> 合肥
<li>大湖名称</li>
<li>创新高地</li>
<li>科教之城</li>
<li>能源之都</li>
<hr>
</ul>
<!-- 有序列表 ol-->
<!-- li标签 列表项标签,必须写在ol标签内
ol标签属性 type:设置列表项符号,常用值有
数字1:列表项前为数字 默认项目符号 从1开始
A:列表项前面从大写英文字母,从A开始
a:小写英文字母 从a开始
I: 大写罗马数字 从I开始
i:小写罗马数字 从i开始 -->
<!--start属性 设置列表符号起始值,该属性值只能是数字 -->
<ol> 合肥
<li>大湖名称</li>
<li>创新高地</li>
<li>科教之城</li>
<li>能源之都</li>
</ol>
<hr>
<ol type="I" start="5"> 合肥
<li>大湖名称</li>
<li>创新高地</li>
<li>科教之城</li>
<li>能源之都</li>
</ol>
<!-- 自定义列表 -->
<dl>
<dt>合肥</dt>
<dd>大湖名称</dd>
<dd>创新高地</dd>
<dd>科教之城</dd>
<dd>能源之都</dd>
<dt>合肥</dt>
<dd>大湖名称</dd>
<dd>创新高地</dd>
<dd>科教之城</dd>
<dd>能源之都</dd>
</dl>
<!-- 列表标签的嵌套 -->
<ul>
<li>宝马</li>
<ol>
<li>525</li>
<li>530</li>
<li>7系</li>
</ol>
<li>奥迪</li>
<ol>
<li>525</li>
<li>530</li>
<li>7系</li>
</ol>
</ul>
</body>
四、表格标签
<!-- tr 行 td、th(黑体居中,一般用于第一行作为表头) 列 -->
<!-- table常用属性
border属性:设置边框粗细,一般设置为1px
cellspacing属性:设置单元格边框之间的距离,一般设置为0,去除边框之间的距离
cellpadding属性:设置单元格内容与左边框的距离
wight属性:设置表格宽度
height属性:设置表格高度
align属性: center 居中 left 默认值 right 右对齐-->
<!-- thead 标签 头部标签
tbody 标签 主体标签
tfoot 标签 底部标签-
可以省略 不然会自动放到tbody内-->
<!-- rowspan 行合并,可以讲同一列中相邻的多个单元格合并成一个单元格,再一个单元格上写rowspan属性
colspan 列合并 -->
五、表单标签
<!--
form 标签:表单标签,注意不要写成from,常用属性有
action属性:设置表单数据提交到的后端程序文件,可以是asp、php、jsp、Servlet 等程序
method属性:设置表单数据的提交方式,常用值有get 和post方法
get:讲表单数据拼接到URL后面,格式为URL?键名=值&键名=值……
表单提交的值是明文形式拼接在URL后面 不安全
get方式提交的数据量有限制,绝大部分浏览器对get方式提交的数据都不能超过4kb
post方式:讲表达数据写在后台的包中,不会拼接在URL后面
表单提交的数据在URL后面是看不到的,更加安全
post提交的数据可以是不同形式,甚至包括图片文件等
post提交的数据量是比较大的
input标签:表单控件标签 常用属性有
type属性:控件类型 常见值有
text:文本框 输入的是明文
password:密码 看不见直接数据
radio:单选按钮,需要多个单选项通过name属性进行互斥,要求name属性值相同
checkbox:复选框,可以实现多个选项
submit:提交按钮,会将表单数据提交到action属性值指示的程序中
image:图片提交按钮,用一个图片替代了submit按钮,效果与submit一样
reset:重置按钮
button:普通按钮,点击该按钮没有任何效果,他需要配合JavaScript一起使用
name属性:设置表单控件名称,后端程序通过这个名称获取表单控件内的数据
value属性:表单控件中的数据存储在value中(设置控件中的默认值)
checked属性:在radio 和checkbox中可以通过该属性设置默认选项
select标签:下拉列表标签
name属性:设置表单控件名称,后端程序通过这个名称获取表单控件内的数据
value属性:表单控件中的数据存储在value中(设置控件中的默认值)
option标签:下拉列表标签,该标签必须写在select标签中
selected属性:用来设置下拉列表默认选项值
textarea标签:常用属性值有
name属性:设置表单控件名称,后端程序通过这个名称获取表单控件内的数据
value属性:表单控件中的数据存储在value中(设置控件中的默认值)
cols属性:设置文本域的宽度
rows属性:设置文本域的高度
-->