`
闫九领
  • 浏览: 2111 次
  • 来自: 安徽合肥
最近访客 更多访客>>
一笑ing
社区版块
存档分类
最新评论

HTML5DAY01

html5 
阅读更多
1 第一阶段
  HTML5基础(HTML5Basic)
  CSS3基础
  PROJECT1 (京东首页)
  WEB UI (PS)
  PROJECT2 (京东详情页)
  CSS3核心
  Javascript 基础

2、JS（Javascript）
3、html5，服务器端 ... ...

1、W3C
   World Wide Web Consortium
   万维网联盟

   1、什么是WEB
      WEB 就是无数 网页文档的集合
   2、作用
      能够将各类信息和服务进行无缝连接，并提供生动的图形用户界面

      WEB - 网页
   3、WEB 工作原理
      基于 浏览器/服务器(B/S) 模式
      互联网程序模式：
      1、C/S
         Client / Server
客户端   服务器
只能通过指定的客户端去访问服务器程序的一种方式
QQ, ... ...
      2、B/S
         Browser / Server
浏览器    服务器
通过 浏览器 去访问服务器程序的一种方式

1、组成
            1、WEB 服务器
    2、浏览器
       用户代理(User Agent : UA)
    3、通信协议
       http : Hyper Text Transfer Protocal
              超    文本 传输     协议
规范了数据是
   如何进行打包的
   如何进行传递的

       请求：
       响应：
         2、WEB 服务器
    1、功能
       存储 WEB 上的信息
       响应客户端的请求
    2、主要服务器产品
       TOMCAT
       IIS
       APACHE
3、WEB 浏览器
    1、功能
       代理用户 提交请求
       作为 HTML 代码的解释器
       以图形化方式显示HTML文档
    2、主流的浏览器
       IE
       Google Chrome
       Apple Safari
       Mozilla Firefox
       Opera
      3、相关技术
         1、服务器端技术
    php
    jsp
    asp
    aspx
2、客户端技术
    HTML
    CSS
    Javascript(JS)
2、HTML 快速入门
   1、HTML概述
      1、什么是HTML
         就是一个网页文档，WEB页面
Hyper Text Markup Language
Markup：标签，html文档内容组成的最基本方式。
Language：语言
   2、HTML语法
      1、标签(标记)
         1、什么是标签
    就是描述功能的一个符号<p></p>
2、语法
    标签在使用时，必须用<>括起来

    标签分为
      封闭类型
      非封闭类型
3、封闭类型标记-双标记
    必须成对出现，一个表示开始，一个表示结束
    <标签>内容</标签>
    注意：
      封闭类型标记，必须要有结束，否则会产生意想不到的效果
4、非封闭类型标记-单标记(空标记)
    一个标签，既能表示开始，也能表示结束。没有内容可以控制。

    每一个单标记，都是一个独立的功能
    <标签>
    或
    <标签/>
      2、元素
         1、什么是元素
    就是标签。
    标签及其控制的内容，可称之为 元素
2、元素嵌套
    在一个元素(标签)中嵌套了另外一个元素(标签)

    注意：
      1、嵌套顺序
      2、代码规范-缩进
3、属性 和 值
    属性以及值，是用来修饰元素的。
    <标记 属性名称="值" 属性名称="值"></标记>

    <p align="center"></p>

    标准属性：
      id:定义元素再文档中的唯一名称
      title:鼠标移入到元素时所显示的文字
      class:关联类选择器时使用
      style:定义元素的内联样式
      3、注释
         语法：<!--  注释内容  -->
特点：
   1、不会被浏览器所解析
   2、不允许被嵌套
   3、不允许出现在 < 不能出现注释 >
   3、HTML 版本
      1、HTML4.01
      2、XHTML1.0
      3、HTML5
         2014年10月29日 发布第一版本的规范
1、支持了更多规范
2、代码更加简洁
    <p align="center"></p>
    <p align=center></p>

    <input readonly="readonly">
    <input readonly>
   4、文档结构
      1、文档组成
         1、文档类型声明
    指定当前网页的类型和版本
    html5文档类型声明：
      <!doctype html>
    位于 整个网页文档的最上方
2、html页面
    表示 整个 网页文档的内容
    位于 文档类型之下，由一对html标记组成

    <!doctype html>
    <html>
    </html>
      2、文档内容
         1、网页头部
    1、作用
       用于定义页面的全局信息，比如：标题，描述，关键字，编码格式，定义JS，定义CSS
    2、语法：
       由 一对 head 标记表示
       <head></head>

       位于 html 根标记之内
    3、子标记
       1、网页标题
          <title>标题内容</title>
       2、编码格式
          <meta charset="utf-8">
       3、其他子标记
          <style></style>
  <link />
  <script></script>
  <meta name="" content="">
2、网页主体
    1、作用
       描述 展示给用户去看的东西
    2、语法
       <body></body>
       位置：
         <html>之内
<head>之下
3、文本标记
   1、特殊字符的处理
      1、空格
         &nbsp;
      2、<
         &lt;
      3、>
         &gt;
      4、©
         &copy;
      5、￥
         &yen;
   2、文本标记
      1、文本样式
         <b>...</b> 加粗
<i>...</i> 倾斜
<s>...</s> 删除线
<u>...</u> 下划线
<sub>...</sub> 下标
<sup>...</sup> 上标
      2、标题元素
         突出显示内容标题(改变字体，以及加粗)
<h#></h#>
#:1-6
<h1></h1> 一级标题(最大)
...
<h6></h6> 六级标题(最小)
      3、段落元素
         表现形式：上下会具备垂直的空白距离
<p></p>
      4、换行元素
         <br>
      5、分割线元素
         <hr>
属性：
   size：尺寸
   width：宽度
   align：水平对齐方式 (left/center/right)
   color：颜色
      6、分区元素
         1、行分区元素
    <span></span>
    作用：用于自定义文本效果
2、块分区元素
    <div></div>
    作用：布局
      7、行内元素 块级元素
         1、块级元素
    独占一行
    <div></div>
    <p></p>
    <h1></h1>
    ...
    <h6></h6>
    作用：布局
    注意：
      1、p元素中，不允许嵌套其他的块级元素(包含自己)
      2、非布局标记，不要嵌套div
         允许嵌套div
<li>
<td>
<dt>
<dd>
结构化标记
      3、行内元素不要嵌套块级元素
         2、行内元素
    特点：多个元素会在一行内显示
    作用：用来修饰文本的不同表现形式
    <span></span>
    <i></i>
    <u></u>
    <s></s>
    <b></b>
    ...
      8、预格式化
         保留 源文件中的 空格 和 回车
<pre></pre>
分享到：
仅供参考
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    HTML5_day01

    HTML5_day01:主要记录了sublime的信息以及安装，和Package Control的插件管理器，和Emmet插件的简略使用

    HTML5CSS3_day01.md

    ### HTML5与CSS3知识点详解 #### 一、HTML5概览 - **HTML5**是一种标记语言，代表HyperText Markup Language（超文本标记语言）的第5个主要版本，标志着该标准的一次重大更新。它引入了一系列新的特性和功能，以...

    day01.html

    day01.html

    Day01-HTML5.rar

    这个名为"Day01-HTML5.rar"的压缩包文件很可能是针对初学者的一份学习资料，涵盖了HTML5的基础知识和应用。下面将详细讨论HTML5的相关知识点。 一、HTML5概述 HTML5是Web标准的核心部分，旨在提高网页的互操作性、...

    day01基础WEB

    【标题】：“day01基础WEB” 在计算机科学领域，Web开发是构建和维护Web应用程序的过程，它使得用户可以通过互联网进行交互。"day01基础WEB"可能是一个学习系列的第一部分，专注于介绍Web开发的基本概念和技术。这...

    学习前端-HTML-day01

    学习前端-HTML-day01

    day01-HTML附件

    在这个"day01-HTML附件"的学习资料中，我们将深入探讨HTML的基本概念、元素、属性以及如何在实践中运用它们。 1. **HTML基础**: HTML由一系列元素组成，这些元素以开始标签和结束标签的形式出现，如`&lt;p&gt;`和`&lt;/p&gt;`，...

    day01.doc.html

    day01.doc.html

    前端学习day01-HTML标签01

    本教程“前端学习day01-HTML标签01”着重讲解HTML的基本概念和常用的HTML标签，旨在帮助初学者入门HTML，了解其在网页设计中的重要作用。 HTML由一系列元素组成，这些元素通过标签来表示。标签通常成对出现，比如`...

    day01（HTML01-认知）.zip

    这个“day01（HTML01-认知）.zip”压缩包文件很可能是某个在线课程或自学教程的第一天内容，专注于对HTML的基本理解和应用。 HTML的核心在于一系列的标签，这些标签构成了网页的结构和内容。例如，`&lt;html&gt;`标签是...

    Vue入门day01笔记

    ### Vue入门day01笔记详解 #### 库与框架的区别 在软件开发中，库（library）和框架（framework）都是提高开发效率、简化开发流程的重要工具，但它们有着本质的区别。 - **库（Library）**： - 库通常为开发者...

    day01.docx

    HTML，全称HyperText Markup Language，是一种用于创建网页的标准标记语言。它允许我们将文本、图像、链接等元素组织成结构化的文档，并通过浏览器呈现出来。HTML由一系列的元素组成，这些元素通常被称为标签，它们...

    传智播客崔希凡JavaWeb-day01-基础加强-全部资料

    首先，我们来看看文件列表中的"day01.doc"，这通常是一个文档文件，可能包含了day01课程的详细讲义或笔记，包括JavaWeb开发的基本概念、环境配置、HTML和CSS的基础知识、以及Servlet和JSP的入门等内容。这份文档可以...

    day01-HTML-CSS-JavaScript

    day01-HTML-CSS-JavaScript

    在线教育课程day01_前端项目

    在线教育课程day01_前端项目是针对初学者或有一定基础的前端开发者设计的一个课程，旨在教授如何构建一个在线教育平台的前端项目。这个课程涵盖了前端开发的基本概念、技术栈和实际操作步骤，帮助学员逐步掌握搭建...

    day01-HTML-CSS.md

    day01-HTML-CSS.md

    中软培训 day01.md

    ### 中软培训 day01.md #### Sublime Text 介绍 Sublime Text 是一款非常流行的文本编辑器，尤其受到程序员的青睐。它不仅适合编写HTML、CSS、JavaScript、PHP等前端开发语言，还广泛用于其他多种编程语言。下面将...

    springmvc_day01_01_start.zip

    本教程以"springmvc_day01_01_start.zip"为起点，旨在帮助初学者快速掌握SpringMVC的基本概念和使用方法。我们将通过一个简单的示例，演示如何利用SpringMVC实现一个超链接请求到控制器（Servlet），从而完成页面的...

    day01html基础1总结.xmind

    day01html基础1总结.xmind

Magicbox
Global site tag (gtag.js) - Google Analytics