前端语言 | 青训营笔记

64 阅读2分钟

前端语言

本文将会从前端语言的基本能力、协作配合以及一些扩展的三个方面来简单叙述前端语言。因为这些都是基本的概念,所以涉及到的东西不会太多。

第一点 前端语言的基础

前端语言由3种语言共同构成,分别是HTML、CSS、JavaScript。三者缺一不可。把前端比作是人的话,HTML是骨架,CSS是外表,JS是肌肉,使其可以具备某些能力,当三者融合在一起的时候,就可以展示出一个完美、可互动的页面。

第二点 前端语言的协作配合

1.CSS in HTML

  • 线上编写CSS的代码:
    <p style="color: blue;">This is a paragraph.</p>
  • 引用内部CSS的代码:
    <head>
    <style type=text/css>
    body {background-color: blue;}
    p{color: yellow;}
    </style>
    </head>
  • 引用外部的CSS的代码:
    <head>
    <link rel="stylesheet" type="text/css" href="style.css">
    </head>\

2.HTML in JavaScript

屏幕截图 2023-05-03 100232.png

第三点 HTML的概述

HTML只是一门标记语言,由标签元素Element、文本Text、注释Comment、DTD Document Type Defination、处理信息Processing Instruction组成。

1.HTML head标签

head标签由五部分组成:
  • title:标题,全局唯一;
  • base:向页面所有相对URL提供前缀,全局唯一;
  • meta:通常是约定好的键值对,例如charset、http-equiv;
  • link:rel决定类型,href决定引入地址;
  • script:type指定MIME类型,可以内嵌代码,可以外链文件。

2.HTML body标签

body元素定义文档的主体,包含文档的所有内容(比如文本、超链接、图像、表格和列表等等)

body标签由六部分组成:
  • alink:规定文档中活动链接的颜色;
  • background:规定文档的背景图像;
  • bgcolor:规定文档的背景颜色;
  • link:规定文档中未访问链接的默认颜色;
  • text:规定文档中所有文本的颜色;
  • vlink:规定文档中已被访问链接的颜色。

3.HTML5 WebAssembly

web assembly(WASM)是一种新的编码方式,可以直接在浏览器中运行。在浏览器外可以作为编译器代码编译目标以及云技术的应用,在浏览器内可以提供的服务有流媒体视频的编解码加速、短视频的冷启动加速、前端JavaScript代码防盗混淆、在线音乐制作工具、在线图片编辑工具、原生应用移植、前端应用构建框架、前端组件库以及物理引擎。

4.web

web无需安装,也不需要强大的硬件,而且容易升级,具有很高的容错性,传播方便,具有丰富的API能力,框架、工具逐渐标准化,开发和调试比较简单,具有跨平台能力。

以上就是本文的全部内容,如有不足,敬请指正。