FirstHtml 的知识总结

千面狐～

已于 2022-06-19 10:22:57 修改

阅读量220

点赞数

文章标签： html css 前端

于 2022-06-19 10:08:01 首次发布

本文链接：https://blog.youkuaiyun.com/hutongkoudemihu/article/details/125354904

版权

本文总结了HTML的基础知识，包括浏览器介绍、HTML结构、元素定义、CSS样式、链接语法、引用使用、目标窗口设定、文件路径、HTTP协议、默认页面、内部链接和图像格式等核心概念。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

FirstHtml 的知识总结

表示强调强调的内容用斜体表示

	<em></em>

火狐浏览器 Firefox
谷歌浏览器 Chrome
苹果浏览器 Safari
IE浏览器 Internet Explorer
Opera
页面主体包含web页面的所有内容和结构，这就是我们在浏览器中看到的部分。
编写html时，要把首部（head）和页面主体分开。
元素=开始标记+内容+结束标记
浏览器并不关心制表符、回车和大多数空格，所以标记可以在同一行上的任何位置开始和结束，或者也可以在不同行上开始和结束。
css是层叠样式表（cascading Style Sheets）的缩写。css提供了一种方法来告诉浏览器页面中的元素如何显示。
href:超文本引用 hypertextreference
取消列表中的圆点：link-style:none;
需要告诉浏览器你要链接的文件在父文件夹中时，可以使用“…”表示“向上移至父文件夹”。告诉浏览器查看上一级文件夹，告诉浏览器上行的方法就是使用“…”。
如果需要向上两级文件夹而不是一级该怎么办：
每次要上行到父文件夹时都可以使用“…”。每一次使用“…”，就会向上到上一层父文件夹。
如果想上行两级文件夹，可以输入“…/…”。仍然要用“/”分隔每一部分。（浏览器是不知道"…"是什么意思的。）
例如：如果要链接到一个名为“fruit.html”的文件夹中，就可以写为“…/…/fruit.html”.
web使用通用分隔符，所有操作系统都要使用这个分隔符，不管使用什么操作系统，在html的路径中都要使用“/”。
单击一个链接时，浏览器会加载href属性中指定的web页面。
相对路径是相对于链接的源web页面指向网站中其他文件的一个链接。就像在地图上一样，终点总是相对于起点。
在html中添加简短的引用：
元素：
每个引用都要用开始标记和一个结束标记包围。注意：这里没有在引用周围加双引号。
浏览器会负责给这些引用加上双引号。但并不是所有的浏览器都会在元素的内容两边加双引号。使用双引号并不代表它确实是引用文字。
元素用于短引用，作为现有段落的一部分。

    <blockquote>元素用于较长的引用（一段或多段文字），需要单独显示。
    <blockquote></blockquote>需要成对使用
    一个引用中可以有多段，只需要把段落元素放在<blockquote>中，一个段落元素对应一个段落。
    <q>元素和<blockquote>元素可以嵌套使用，可以把一个<q>元素放在<p>元素中，也可以把<q>嵌在<blockquote>中。

	<h1>,<p>,<blockquote>,<div> 都是块元素
    <q>,<a>,<img>,<em>,<span>都是内联元素

 块元素：特立独行
 内联元素：随波逐流
 块元素通常用作Web页面中的主要构件模块，而内联元素往往用来标记小段内容。设计一个页面时，一般先从较大的块开始（块元素），然后在完善页面时再加入内联元素。
每个块元素都单独显示，就好像前后都有换行。
 行内元素<q>则不同，与所有元素一样，<q>会显示在所在的段落中。

	<br>元素是一个没有任何内容的元素，我们把没有实际内容的元素叫做void元素。
   	<img>元素也属于void元素。
  	 世界上有两类元素：正常元素和void元素。

有些页面上没有使用<br>而用了<br/>？
   意思完全是一样的。处理XHTML时，<br/>的语法更为严格。不过除非要规划或编写与XHTML兼容的页面，否则html中都应该使用<br>.

有序列表：
   <ol>
     <li></li>
     <li></li>
     <li></li>
   </ol>

无序列表：
   <ul>
      <li></li>
      <li></li>
      <li></li>
   </ul>
    
unordered list=ul
ordered list=ol
list item=li

   <ol><li>为块元素。

定义列表
   <dl>
   定义术语
   <dt>
   定义描述
   <dd>

   <dl>
      <dt></dt>
      <dd></dd>
   </dl>

<ol>和<li>(<ul>和<li>)总是要一起使用。
    列表其实就是一组列表：<li>元素用来标识每个元素，<ol>元素将它们归为一组。
    <ol>和<ul>元素设计只能包含<li>元素。
    可以在列表中嵌套一个列表。

使用target打开新的窗口：

<a target="_blank" href=""></a>

为了方便访问，可以在<a>元素中使用title属性提供链接的一个描述。

域名是一个唯一的名字，如amazon.com或starbuzzcoffee.com，用来唯一标识网站。
文件传输协议（File Transfer Protocol,FTP）是向服务器web页面和内容的常用方法。
FTP应用提供了一个图形用户界面，使FTP的使用更为容易。
URL是统一资源定位符或Web地址，可以用来标识web上的任何资源。
典型的URL由一个协议、一个网站名和资源的一个绝对地址组成。
HTTP是一个请求和响应协议，用来在Web服务器和浏览器之间传送Web页面。
浏览器使用FILE协议从你的计算机读取页面。
绝对路径是从根文件夹到一个文件的路径。
"index.html"和"default.html"都是默认页面。如果指定一个目录而没有指定文件名，则Web服务器会查找一个默认页面返回到浏览器。

<a>
元素的href属性中可以使用相对路径或URL来链接其他web页面。对于你的网站中的其他页面，最好使用相对路径，对外部链接才使用URL.

可以使用id属性在页面中创建一个目标。使用#后面加一个目标id,可以链接到页面中的那个位置。

为了便于访问，可以在<a>元素中使用title属性提供链接的一个描述。

使用target属性在另一个浏览器窗口中打开链接。对于使用不同设备和浏览器的用户，target属性可能会有问题。
WEB上常用的三种格式：JPEG、PNG、GIF.

 JPEG:
   1. 最适合连序色调图像，如照片。
   2. 可以表示包含多达1600万钟不同颜色的图像。
   3. 这是一种“有损”格式，因为缩小文件大小时会丢掉图像的一些信息。
   4. 不支持透明度。
   5. 文件比较小，以便Web页面更高效地显示。
   6. 不支持动画。
 PNG:
   1. 最适合单色图像和线条构成的图像（如logo、剪贴画和图像中的小文本）。
   2. PNG可以表示包含上百万种不同颜色的图像。PNG有3种：PNG-8、PNG-24、PNG-32，取决于你需要表示多少种颜色。
   3. PNG会压缩文件来缩小文件大小，不过不会丢掉信息，所以这是一种“无损”格式。
   4. 允许将颜色设置为“透明”，使图像下面的东西可以显示出来。
 GIF:
   1. 最适合单色图像和线条构成的图像。
   2. GIF可以表示最多256种不同颜色的图像。
   3. 支持透明度，不过只允许一种颜色设置为“透明”。
   4. GIF往往比相应的JPEG文件大。
   5. 支持动画。

是一个内联元素，它不会在前面或后面插入换行。它是一个void元素。

  <img src="images/drinks.gif">

<img>不只是用于相对链接，还可以在src属性中放入URL。
    图像与HTML页面一同存储在Web服务器上，所以Web上的每个图像都有自己的URL，就像Web页面一样。

void元素是指HTML页面中在开始标记和结束标记之间没有任何内容的元素。
    图像也是内容，但是图像并不是HTML页面本身的一部分，浏览器显示页面时，图像会取代<img>元素。HTML页面是纯文本，所以图像绝对无法直接作为页面的一部分，它是单独存在的。 
    GIF是唯一支持动画并活得广泛支持的格式。

可以使用<img>元素的alt属性为访问者提供一些暗示，告诉他们图像里有什么信息。