前端三剑客快速入门（一）

2022-10-06

前言：

前端三剑客即HTML、CSS、JavaScript。本文只对其进行简单介绍，达到简单WEB程序所需。若想要深入学习，可以查看W3C教程，其对三者进行了详细的介绍。

HTML

简介：HTML是一种超文本标记语言，由浏览器来解析运行，其作用为编写网页的结构。
常见标签及代码：

第一节：日常标签



    
    
    
    我的第一个网页

    

        hello world
        hello world
        hello world
        hello world
        hello world
        hello world
    

    这是我的第一个网页这是我的第一个网页这是我的第一个网页这是我的第一个网页
    这是我的第一个网页这是我的第一个网页这是我的第一个网页这是我的第一个网页这是我的第一个网页这是我的第一个网页

    
        香蕉
        鸭梨
        苹果
    

    
        香蕉
        鸭梨
        苹果
    

    跳转到百度
    

    hehehe
    hehehe

    红
    黄
    蓝
    绿

第二节：表格和表单

学生列表
一班	1	小红	7
2	小鹿	5
3	小张	6

CSS

简介：CSS全称层叠样式表，用来控制网页的样式，其作用主要是美化网页。
CSS选择器与常用属性及其代码

第一节：选择器类型



    
    
    
    Document
    

    hello world

    类选择器
    这是一个段落，它应该是蓝色的。这是一个段落，它应该是蓝色的。这是一个段落，它应该是蓝色的。

    一个块，它会是紫色的

第二节：选择器常用属性



    
    
    
    css选择器常用属性
    

   hello world

第三节：选择器进阶
层级选择器和组合选择器



    
    
    
    Document
    

    
        hello h1
        hello h2
    
    
        box2容器
        hello world

伪类选择器和伪元素选择器



    
    
    
    Document
    

    
    hello h1
    heloo h2

选择器权重

不同选择器权重：id（100）>class（10）>element（1）
相同选择器：后面的会覆盖前面的
层级选择器：将权重累加比较



    
    
    
    Document
    

    
        hello world

设置最高权重
!important



    
    
    
    Document
    

    
        hello world

引入CSS的方法

嵌入样式
内联样式
外部样式



    
    
    
    Document

    

    

    hello world
    hello green

后续

因为内容实在是比较多，所以我分开来写了，CSS还没写完，JS也还没开始。后面还打算写node和vue，只能说路漫漫其修远兮，容不得一点懈怠啊！

文章来源于互联网：前端三剑客快速入门（一）

THE END

二维码