HTML学习总结

最新推荐文章于 2024-03-13 15:03:28 发布

...x

最新推荐文章于 2024-03-13 15:03:28 发布

阅读量89

点赞数 1

本文链接：https://blog.csdn.net/yychNB/article/details/118000629

版权

HTML学习总结

#HTML文档结构
HTML中使用“标记”来标注文本、图片等内容，如 <head>,<title>,<body>,<header>,<p>，<div>，<span>等。
一个HTML的元素如 <p>嘿嘿</p>，这个整体叫做元素，由开始标签，结束标签和内容组成.
1.开始标签:：如被左右括号包围，如p。表示元素从此开始。
2.结束标签：与开始相似，在p前加入斜杠，表示元素再次结束。
3.内容：元素内容，这里是嘿嘿。
4.元素：上面三个元素组合在一起就是一个元素。

创建一个HTML文档会有一个基本结构

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="        ">
  <title>      </title>
</head>
<body>
</body>
</html>

<!DOCTYPE html>：这里声明文档类型。
<html></html>：这个元素中的内容是整个页面。其他所有元素都在在其中。
<head></head>：这个元素中的内容包含在HTML页面中，但不会在页面中显示。
<body></body>：这个元素包含所有在页面中可以看到的内容，包括文本、图片、音频等。
<meta charset="utf-8">：这个元素设置文档使用utf-8字符集编码，基本上能识别放上去的所有文本内容。使用它能在以后避免很多其他问题。
<link rel=" ">：指定页面的图标，出现在浏览器标签上。
<title> </title>：设置页面标题，出现在浏览器标签上。

：使用可以将内容设为注释，在编写HTML文档是可以使用注释来对代码进行解释分析。
除此之外还有如<br>这样的空元素，只有一个开始标签，用于在所处位置插入一些东西等。

#标题和文本
标题在界面中很重要，HTML的标题有6级，从<h1>到<h6>，其中，第一级标题用于做主标题，它是最大最醒目的标题，二级标题次之，以此类推。不过不要为了醒目而使用标题对文字进行放大缩小操作，应使用文本格式或者css。
使用<p>文本</p>或<pre>文本</pre>等标签可以在页面中显示文本内容，使用这类标签可以保留你想要的特殊格式或在页面展现源代码。

#超链接
在网页中常常会添加超链接，我们可以把任何需要的东西加上超链接。超链接的语法为<a href="https://www.bilibili.com/" target="_blank">bilibili</a>
效果如下：点击跳转到B站
href后面为将要跳转的地址URL
targetk属性是_blank表示在新的页面中打开超链接（默认在当前则为_self）
超链接标签包含的内容则为显示在页面上供用户点击的。

锚点：也称书签，用于标记页面上某个元素或位置。通过锚点我们可以在页面上实现跳转。

<h2 id="C1">换个地方</h2>
<a href="#C1">点这里换个地方</a>

先使用id属性生成某元素的锚点，然后再使用超链接指向该锚点即可。

#图片及文件路径
<img src="picture1.jpg" alt="MDB Logo" >
src属性表示在页面显示的图片文件的位置
alt属性当获取图片出现问题时显示的文字。


`<img src="picture1.jpg" >`	该图片文件与当前文档在同一目录中
`<img src="./web/picture.jpg">`	该图片文件在当前目录下的web目录中
`<img src="../picture.jpg">`	该图片文件在上一级目录中

#表格与列表
当页面需要展现表格时，我们可以使用<table>等标签来显示。

<table>
    <tr>
      <th>Firstname</th>
      <th>Lastname</th>
      <th>Age</th>
    </tr>
    <tr>
      <td>Jill</td>
      <td>Smith</td>
      <td>50</td>
    </tr>
    <tr>
      <td>Eve</td>
      <td>Jackson</td>
      <td>94</td>
    </tr>
  </table>

<tr>表示行 <td>表示行中的单元 <th>表示表头的单元。

除了表格，列表也是一种展现方式，列表分为无序列表和有序列表。
无序列表

<ul type=“   ”>
  <li>A</li>
  <li>B</li>
  <li>C</li>
</ul>

type后可以改变标志图案，默认使用实心圆点。

有序列表

<ol>
  <li>A</li>
  <li>B</li>
  <li>C</li>
</ol>

蓦然使用数字作为每项标志，同样可使用type更改。

...x

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML学习总结

HTML学习总结#HTML文档结构HTML中使用“标记”来标注文本、图片等内容，如<head>,<title>,<body>,<header>,<p>，<div>，<span>等。一个HTML的元素如<p>嘿嘿</p>，这个整体叫做元素，由开始标签，结束标签和内容组成.1.开始标签:：如被左右括号包围，如p。表示元素从此开始。2.结束标签：与开始相似，在p前加入斜杠，表示元素再次结束。3.
复制链接

扫一扫