简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > List of blog posts > HTML的基础知识、语法等...
Blogger Information
Blog 28
fans 0
comment 0
visits 25669
Special Recommendation
More>
Related recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
HTML的基础知识、语法等...
，多思曩惜，
Original
583 people have browsed it

html

1.网页的组成

任何一个页面都有三部分

序号 内容 描述
1 文本内容 用户可见的内容
2 其他资源的引用 图片，视频，音频…
3 标记 对文本，其他资源的描述 
  1. <p>
  2. php中文网学习
  3. </p>
  4. <img src="logo.png" alt="log"/>

2.html设计思想

  • 超文本：是指包括了超链接的文本
  • 预定义标记：是用来描述内容的固定标签
  • 语言：HTML 并不是编程语言，只是用来写HTML文档的工具

3 HTML基础范本

  1. <!DOCTYPE html>
  2. <!--通知浏览器，我是一个html5文档-->
  3. <html lang="en">
  4.   <!-- html：根标签/根元素 -->
  5.   <head>
  6.     <!-- head的内容，用户不需要看到，给开发者看 -->
  7.     <!-- 元数据：描述某种特定信息的数据 -->
  8.     <meta charset="UTF-8" />
  9.     <!-- 当前字符集是utf-8 -->
  10.     <!-- viewport: 视口/可视区屏幕上 -->
  11.     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  12.     <title>当前页面的标题</title>
  13.   </head>
  14.   <body>
  15.     <h2>php中文网欢迎大家...</h2>
  16.   </body>
  17. </html>

4.元素，属性和值

4.1元素与标签

元素 标签 描述
非空元素 双标签 <p>学习很快乐</p>
空元素 单标签 <img src="1.jpg" alt="">

4.2属性和值

  • 属性写在起始标签
  • 值：预定义值，字符串，指定格式，数值，布尔值
  • 布尔：只要在元素中出现这个属性，就代表ture，不需要就不要使用
  • 几乎所有元素都可以设置的三大通用属性：’id’,’class’,’style’

5.网页中的实体字符

  • 空白的处理：空格，制表符，换行符

6.文件与文件夹

  • 全部使用小写
  • ‘.html’,’.htm’
  • 文件名：’hello_world.php’

7.URL

7.1 语法

  • http/https:协议，模式
  • www.baidu.com ：域名/主机名， 114.234.2.45
  • course/379.html : 访问的资源在服务器上的真实路径

8.自我总结

  1. <!DOCTYPE html>
  2. <!--通知浏览器，我是一个html5文档-->
  3. <html lang="en">
  4.   <!-- html：根标签/根元素 -->
  5.   <head>
  6.     <!-- head的内容，用户不需要看到，给开发者看 -->
  7.     <!-- 元数据：描述某种特定信息的数据 -->
  8.     <meta charset="UTF-8" />
  9.     <!-- 当前字符集是utf-8 -->
  10.     <!-- viewport: 视口/可视区屏幕上 -->
  11.     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  12.     <title>当前页面的标题</title>
  13.     <style>
  14.       .active {
  15.         background-color: chartreuse;
  16.       }
  17.       .div2 {
  18.         width: 500px;
  19.         margin: auto;
  20.       }
  21.     </style>
  22.   </head>
  23.   <body>
  24.     <div style="width:100%s;">
  25.       <h2 style="color: brown; font-size: 36px;" class="active">
  26.         php中文网欢迎大家...
  27.       </h2>
  28.       <div class="div2">
  29.         <a href="https://www.php.cn">PHP中文网</a>
  30.         </br></br> 
  31.         <form action="" method="GET">
  32.           <label for="user">账号:</label>
  33.           <input type="text" placeholder="请输入账号;" id="user" required />
  34.           </br></br> 
  35.           <label for="pass">密码:</label>
  36.           <input type="password" placeholder="请输入密码;" id="pass" required />
  37.           </br></br> 
  38.           <button>登录</button>
  39.         </form>
  40.       </div>
  41.     </div>
  42.   </body>
  43. </html>
Correcting teacher：天蓬老师天蓬老师

Correction status：unqualified

Teacher's comments：手写呢?
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！