前端语言串讲

一、前端语言的基本能力

1.1对css回顾

在此前有自学过一些css的用法，知道如何去写样式。在此次课程中又对css进行了一次回顾。对它的一个基本组成结构和它在前端三件套中有什么作用有了进一步的了解。


H{color:red;height:100px;}
//H:Selector
//color、height:property
//red、100px:value

样式添加途径，一个是直接在html标签中直接添加，此方法虽然写代码时比较顺手，在以后修改信息查找时也很方便，清晰明了，但是对我本人而言可读性不强，一眼望去会比较乱，没有与html标签分隔开来。

<p style="color:red;">你好</p>

第二种是在head部分通过style标签添加，此方法是我最常用的途径，这样不仅可以将其与标签分开，修改代码时也可以在style标签中直接找到，而且这样的属性写法看下来也很清楚。

<head>
<style type=text/css>
p{
color:red;
}
</style>
</head>

第三种是引入外部样式（大部分人使用较多），对于后续使用了js后，在做动画变更效果等时会经常在js中使用。

<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>

1.2.伪类、伪元素选择器

两者最根本的区别是看是否创建了新的对象。
伪元素/伪对象：不存在于DOM文档中，代表着某个元素的子元素，只在逻辑上存在。
伪类使用“：”，伪元素使用“：：”。伪类可以是多个，但伪元素在一个选择器只能出现一次，并且只能出现在末尾。

1.3.JavaScript

 变量的定义：var a=7+"2" 
 // 最终会显示为72，这种写法会自动将7变为字符串型与2匹配。  
 对象的定义:
 var user={
  name:"baili",  
  age:19,  
  sex:"woman",  
  maxgrade: function(){  
  //...  
  }  
  }

二、总结：

在本节课中，重新回顾了前端语言，同时，还学习到了可以通过js来渲染html模板也可以用js来写html和样式。此外，可以利用dom元素来直接修改它的属性等。总体来说，对于以前的基础知识有了一个大致回顾，后续也学习了前端的其他方面，知道了web的一些相关知识和概念，让我对前端语言有了一个大方向上的认知。

前端语言总固体回顾 | 青训营