HTML学习整理

最新推荐文章于 2023-03-02 20:40:05 发布

路行的亚洲

最新推荐文章于 2023-03-02 20:40:05 发布

阅读量271

点赞数

分类专栏： java

本文链接：https://blog.csdn.net/trytostudy/article/details/77997306

版权

java 专栏收录该内容

26 篇文章 0 订阅

订阅专栏

1.什么是HTML?
Hyper Text Markup Language:超文本标记语言
超文本：功能比普通文本更加强大
标记语言：使用一组标签对内容进行描述的一门语言
2.为什么要学习HTML?

3.语法：
HTML文件以.html或者.htm结尾的。
HTML文件分为头部分<head></head>和体部分<body></body>
HTML标签都是由开始标签和结束标签组成。<hr/>
HTML标签不区分大小写，建议使用小写。
4.HTML相关标签：
标题标签：
<hn /> 其中n表示的是字号，数字越大，字体越小(1~7)的时候，是这样的
水平线标签<hr />
段落标签 
字体标签
属性：size:指定内容的大小
color:指定内容的颜色
face:指定内容的字体
加粗：
斜体：
下划线：

5.步骤分析：
创建一个html文件
创建一个标题标签显示公司的简介
创建一个水平线标签
创建四个段落标签

二、网站图片显示页面
图片标签
<img />
属性：src:指的是图片显示的路径（位置）
绝对路径：比如：电脑中的，E:\Users\ThinkPad\Desktop\0703JavaEE就业班\WEB01_HTML\资料\WEB01\image
相对路径：同一级：直接写文件名称或者./文件名称
上一级：../文件名称
下一级：写上目录名称/文件名称
width:指定图片的宽度，取值可以是像素值，也可以是百分比
height：指定图片的高度，取值可以是像素值，也可以是百分比
alt:当图片无法正常显示的时候给出的提示信息（该属性的显示效果与浏览器以及浏览器的版本相关）
网站友情链接显示页面：
列表标签：
有序列表：
是一列项目，列表项目使用数字进行标记
有序列表始于<ol>标签。每个列表始于<li>标签
如：
<ol>
<li>coffee</li>
<li>milk</li>
</ol>
显示结果：
coffe
milk
列表项内可以使用段落、换行符、图片、链接及其列表等
自定义列表：
自定义列表不仅仅是一列项目，而是项目及其注释的组合。
自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。
如：
<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>
显示结果：
Coffee
Black hot drink
Milk
White cold drink
定义列表的列表项内部可以使用段落、换行符、图片、链接以及其他列表等

reversed 对序号进行反转开头是4 ，同时是数字类型的
<ol start="4" reversed="reversed" type="a">
<li>CSDN</li>
<li>百度</li>
<li>京东</li>
</ol>
输出的结果为
d.CSDN
c.百度
b.京东
如果换成数字就是4,3,2以及那些名称

<ol start="1" type=1>
<li>CSDN</li>
<li>百度</li>
<li>京东</li>
</ol>
输出的结果为
1.CSDN
2.百度
3.京东
相关格式：
1.列表标签：
有序列表：
<ol tyep="I" start="" reversed="reversed">
<li></li>
</ol>
无序列表：
<ul type="">
<li></li>
</ul>
2.超链接
<a herf="" target=""></a>
href:指定跳转的位置
target:指定跳转页面显示的位置（取值:_self、_blank:)
网站首页显示页面：
表格标签：
表格由table标签来定义。每个表格有若干行
tr:行 td：列
<table border="" widt="" height="" align="" background="" cellpadding"" cellspacing="">
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
</tr>
</table>

2.跨行跨列操作：
跨行：rowspan
跨列：colspan
网站后台系统页面：
框架集标签：
<frameset rows="" cols="">
<frame scr=""/>
<frame name=""/>
</frameset>