zoukankan      html  css  js  c++  java
  • html+css快速入门教程(1)

    1 HTML简介

    1.1. 什么是HTML?(了解)

    HTML是超文本标记语言(HyperText Markup Language,HTML)的缩写。是标准通用标记语言(SGML Standard Generalized Markup Language)下的一个应用,是一种规范,一种标准。

    1.2. HTML是干嘛用的?(了解)

    网页文件本身是一种文本文件,它通过标记符号来标记要显示的网页中的各个部分。浏览器按顺序阅读网页文件,然后根据标记符解释和显示其标记的内容。综上所述,HTML是一种能被浏览器识别解析,并且能够显示相应内容的语言,在web开发中,HTML是属于书写网页结构语言,扮演着搭建网页框架结构(这里的框架结构就类似于现代建筑中,修房子需要首先搭建起框架结构一样)的作用,是web开发中必不可少的一门语言

    2 Hello World

    2.1. 挑选合适的浏览器

    最流行的一些浏览器都已经实现了许多HTML的特性,然而不是每款浏览器都支持所有的特性,在把某个特性用到实际项目之前,首先应该检测一下浏览器是否支持这个特性。可以参考http://caniuse.com这个网站,查看浏览器的支持情况。这里推荐几款主流的浏览器

    Google Chrome Mozilla FireFox Opera Apple Safari Internet Explorer(高版本)

    2.2. 开发工具介绍

    文本增强编辑器:语法高亮显示、自动缩进等辅助功能。 EditPlus/notepad++/sublime/Dreamweaver 这类工具小巧,打开速度快

    IDE(集成开发环境),提供的功能主要有语法高亮显示、自动缩进、语法提示、自动完成、版本控制等,提高开发效率。zendstudio/netbeans/phpstorm /webstorm/hbuilder

    2.3. 创建HTML文档(掌握)

    实例2:

    <!DOCTYPE HTML>
    <html>
    <head>
    <title>这是我的第一个网页</title>    
    </head>
    <body>
    <h1>Hello World!</h1>
    </body>
    </html>
    

    实例2中,DOCTYPE 元素让浏览器明白其处理的是HTML文档,表示HTML文档的开始,紧跟其后的是html元素的开始标签,它告诉浏览器:从html开始标签开始到html结束标签,所有元素内容都应作为HTML处理。head元素中的内容为HTML文档的元数据部分,HTML的元数据用来向浏览器提供文档的相关信息。body元素中的内容为HTML的主体,这也是HTML文档的最后一部分。body元素告诉浏览器该向用户显示文档的哪些内容

    2.4. 使用元素

    实例1:

    I like Money and beauty
    ps:在这个实例中,元素分为3个部分,其中有两个部分称为标签(tag),开始标签和结束标签。夹在两个标签之间的是元素的内容(本实例中单词Money为元素的内容)。两个标签连同它们之间的内容构成code元素。

    HTML定义了各种各样的元素,他们在HTML文档中起着各种不相同的作用。因此,学好HTML的关键在于掌握各种HTML元素的不同含义,通俗的讲就是要知道每个元素具体有什么样的功能

    2.5. 父元素、子元素、后代元素和兄弟元素(掌握)

    HTML文档中元素之间有明确的关系。如果一个元素包含另一个元素,那么前者就是后者的父元素,反过来说,后者就是前者的子元素。一个元素可以拥有多个子元素,但是只能有一个父元素。

    实例3:

    <DOCTYPE HTML>
    <html>
        <head>
            <title></title>
            <script src="../index.js"></script>
        </head>
        <body>
            <p>人如果没有梦想,跟咸鱼有什么区别?</p>
            <p>你看那个人,好像一条狗!</p>
        </body>
    </html>
    

    实例3中,最外层的html元素包含了head元素和body元素,那么head元素和body元素就是html的子元素,反之,head和body元素的父元素只有一个,那就是html元素。同时head元素和body元素都是在html元素之下,属于同级元素,相当于辈分一样,我们就称他们互为兄弟元素。而body元素中的p元素相对于html来说,p元素是其子元素的子元素,类似于html的孙子,我们也可以称之为子孙元素,如果更往下嵌套(包含子孙元素),统称为html元素的后代元素。

    注意:除了某个元素的下一级元素我们称之为子元素以后,连续一层一层往下嵌套的都可以称之为后代元素

    2.6 注释

    注释的作用:方便别人或者自己阅读代码

    在html中注释的写法:

    2.7 字符实体

    HTML文档中有些字符具有特殊含义,最明显的就是< 和 >这两个字符。有时候需要在文档内容中用到这些字符,但是又不想被当作HTML来解析处理。因此,产生了字符实体,也就是HTML实体。实体是浏览器用来代替特殊字符的一种代码。

    螺钉课堂视频课程地址:http://edu.nodeing.com

  • 相关阅读:
    国外优秀的icon设计站点
    HDU 2289 Cup (二分)
    HDU 1709 The Balance (母函数 * *)
    HDU 2152 Fruit (母函数)
    POJ 3294 Life Forms (后缀数组)
    HDU 2152 选课时间(题目已修改,注意读题) (母函数)
    HDU 3278 Puzzle (蛋疼。。。。)
    HDU The Rotation Game
    HDU 2069 Coin Change (母函数 | 背包 )
    HDU 2899 Strange fuction (二分)
  • 原文地址:https://www.cnblogs.com/dadifeihong/p/12021319.html
Copyright © 2011-2022 走看看