小白前端路——html基础复习01

最新推荐文章于 2024-09-30 22:02:02 发布

某某叫我改网名

最新推荐文章于 2024-09-30 22:02:02 发布

阅读量52

点赞数

文章标签： html 数学建模前端

本文链接：https://blog.csdn.net/qq_58803729/article/details/131211106

版权

本文介绍了HTML的基本结构，包括元素、属性、样式以及链接和图像的使用。强调了标题、段落、换行标签、div和span在布局中的作用。此外，还讨论了内部样式和外部样式表的应用，以及HTML表格和列表的创建方法。

摘要由CSDN通过智能技术生成

今天主要学习了：

HTML 元素属性样式引用链接图像

下面从最基础的开始讲解：HTML的骨架格式

html骨架格式：

 <!-- 页面中最大的标签 根标签 -->

<html>

    <!-- 头部标签 -->
    <head>     
        <!-- 标题标签 -->
        <title></title> 
    </head>
    <!-- 文档的主体 -->
    <body>
    </body>

</html>

HTML常用标签

主要和css搭配使用，显示网页结构的标签，是网页布局最常用的标签。

标题标签 h(h1~h6)

段落标签 <p> </p>,可以把 HTML 文档分割为若干段落

<p> paragraph段落标签 </p> 文本在一个段落中会根据浏览器窗口大小自动换行，段落和段落之间有空格

换行标签 <br />标签只是简单地开始新的一行，跟段落不一样，段落之间会插入一些垂直的间距。

div和span标签是没有语义的,是我们网页布局最主要的2个盒子。

div是division缩写，表示分割，分区。span意为跨度、跨距。

<div>标签用来布局，但是一行只能放一个<div>（会自动换行）大盒子（相当于分块）

<span>标签用来布局，一行可以多个<span> 小盒子（用于特定的标题文字等小范围）

HTML链接：<a href="http://www.baidu.com">This is a link</a>

HTML图像：<img src = "boat.gif" alt="Big Boat">

HTML样式：

内部样式：
<head>
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>

外部样式：
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

以下是一些常用的样式标签：

HTML表格：

表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

HTML 列表：

无序列表

无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。

无序列表始于 <ul> 标签。每个列表项始于 <li>。

有序列表

同样，有序列表也是一列项目，列表项目使用数字进行标记。

有序列表始于 <ol> 标签。每个列表项始于 <li> 标签。