HTML 其他基础知识

其他

注释

写东西的时候，注释是一个非常好的习惯，可以方便自己和别人日后能够很快速的理解自己现在写的东西，便于维护

注释语句：

<!--这是一段注释-->

实例：

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>这是我们的第一个页面</title>
    </head>
    <body>
        <h1>欢迎加入php.cn</h1>
        <h2>希望你能够在这里学的开心</h2>
        <!--这是一段注释，注意观察，它是不会在页面上显示出来的-->
    </body>
</html>

颜色表示

html颜色表示

  • 网页中的颜色有三种表示方法：
  • 颜色单词：blue、green、red、yellow
  • 10进制表示：rgb(255,0,0)、rgb(0,255,0)、rgb(0,0,255)
  • 16进制表示：#FF0000(红)、#00FF00(绿)、#0000FF(蓝)

自界面中，所有的颜色都可以用三种光的不同波长混合而成。这三种光就是 红光(red)、绿光(green)、蓝色(blue)。

在计算机中，每个基色，用8位二进制(2^8 = 256)，那么RGB共可以表示 256256256 = 1670万色。

用16进制表示颜色时：用2位十六进制代表1位基色。

颜色单词 red green blue yellow
10进制 rgb(255,0,0) rgb(0,255,0) rgb(0,0,255) rgb(255,255,0)
16进制 #FF0000 #00FF00 #0000FF #FFFF00

注意：10进制兼容性不好，尽量少用。10进制颜色表示，常用于CSS中。

实例：

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>这是我们的第一个页面</title>
    </head>
    <body>
<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    </head>
    <body>
     <table border="1" rules="all">
         <tr>
             <td bgcolor="#FF0000" width="50">红</td>
             <td bgcolor="#FF0055" width="50"></td>
             <td bgcolor="#FF00bb" width="50"></td>
         </tr>
           <tr>
             <td bgcolor="#00FF00" width="50">绿</td>
             <td bgcolor="#00FF55" width="50"></td>
             <td bgcolor="#00FFbb" width="50"></td>
         </tr>
           <tr>
             <td bgcolor="#0000FF" width="50">蓝</td>
             <td bgcolor="#0055FF" width="50"></td>
             <td bgcolor="#00bbFF" width="50"></td>
         </tr>
     </table> 
    </body>
</html>

计算机编码（字符集）

计算机编码(字符集)——了解

为什么要有字符集，是因为计算机只能处理二进制数据。为了让计算机能识别人类语言(0-9、a-z、A-Z、特殊符号)，我们就需要对这每一个字符进行“编码”。所谓“编码”就是：每一个字符，可以用不同的二进制来表示。

假设：A 用二进制表示 1000， B 用二进制表示 1001

ASCII编码：用1个字节(8位二进制)来表示所有字符，共可以表示 2^8 = 256 。

ANSI编码：其它国家，都对ASCII编码进行扩展，用于显示本国的语言。

  • ANSI在中文操作系统下，代表gb2312

  • ANSI在繁体操作系统下，代表big5

  • ANSI在日文操作系统下，代表JIS

  • ……

  • 用2个字节(16位二进制)(来表示，共可以表示 2^16 = 65536个字符。

  • GB2312中共收录了6763个汉字。

  • GBK编码：对GB2312进行扩充，收录了一些冷门字、罕见字、古汉语等。共收录2.1万个汉字。

  • Unicode编码：计划将世界上所有字符统一编码，用4个字节(32位二进制)来表示一个字符。

它的缺点：编码表文件太大了，不方便使用。用32位二进制表示一个字符，造成空间极大浪费。

假设：1 用Unicode编码表示 0000000000000000000000000000000000000000000000001

  • UTF-8：统一转换格式编码(多国语言编码)

不同的字符，它会选择合适编码来进行翻译。

如：1 可以使用ASCII中编码(8位二进制)

“国”可以使用2个字节来表示

块元素和行内元素

块元素

  • 块元素，一般是单独占一行，不管内容多少，总是占一行。
  • 块元素有哪些？<div>、<p>、<h1>、<h2>、<pre>等

行内元素

  • 行内元素，不会单独占一行。
  • 行内元素的宽度，主要是根据内容决定。
  • 多个行内元素，会排在同一行。
  • 行内元素有哪些？<font>、<b>、<i>、<u>、<sub>、<sup>等

结论：在标记嵌套时，一般是块元素中嵌套行内元素。

注：这个在排版是要注意，多个行内元素是会排在一行的，如果想换行，则必须使用换行标签，而一个块元素是单独占一行的

HTML中的DIV

DIV是什么

首先看一个网站

18.png

这个网站的每一个红色的框子都大致代表一个DIV，也就是一个逻辑部分。

在网页制作过程过中，把一些独立的逻辑部分划分出来，放在一个<div>标签中，这个<div>标签的作用就相当于一个容器。

语法：

<div>…</div>

确定逻辑部分：

什么是逻辑部分？它是页面上相互关联的一组元素。如网页中的独立的栏目版块，就是一个典型的逻辑部分。如上图所示

给DIV命名

上面，我们把一些标签放进<div>里，划分出一个独立的逻辑部分。在通常的应用中，为了使逻辑更加清晰，我们可以为这一个独立的逻辑部分设置一个名称，用id属性来为<div>提供唯一的名称，这个就像我们每个人都有一个身份证号，这个身份证号是唯一标识我们的身份的，也是必须唯一的。

这个id与之后要学习的CSS和JavaScript结合在一起，就能够制作完出非常炫酷的网站了，这个我们之后再介绍，本节大家理解DIV的用途即可

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>php.cn</title>
</head>
<body>
<div id="html">
   <h2>HTML课程</h2>
    <ol>
       <li>轻松入门HTML+CSS，掌握编程必备技能</li>
      <li>HTML 0基础入门教程</li>
       <li>HTML+CSS 轻松入门</li>
    </ol>
</div>
<div id="php">
    <h2>PHP课程</h2>
    <ul>
       <li>轻松入门PHP，踏上成为大牛的第一步</li>
       <li>php 新手入门</li>
       <li>PHP 零基础 轻松学</li>
    </ul>
</div>
</body>
</html>
posted @ 2022-05-26 11:34  ppqppl  阅读(31)  评论(0)  编辑  收藏  举报