上一篇文章已经写了关于认识前端和了解标签,不了解的可以先了解入门前端基础(保姆式教学1)
今天继续讲解前端基础知识,初学者入门必备部分。了解前端是怎么开发的,怎么使用html+css+js,用自己开发经验描述他们的关系
HTML
- html称为超文本标记语言,是用来描述网页的一种语言,是整个网页的基础骨架.定义网页内容。
- 用自己的话描述就是像人的骨架一样。html是整个网页的一个基础,简单理解为标签,上一章说的单标签和双标签即
<p>我是标签</p>组成的标签 - 可以用来布局整体结构,例如头部,身体、脚部等
css
- css称为层叠样式表,设定网页的表现样式
- 用自己的话描述就是像人一样喜欢打扮变成漂亮的自己,例如会买衣服,首饰,烫发等,css就有这个效果,他可以控制标签的表现形式,例如:控制文字的颜色、文字的位置、文字的3D效果等。
- 他的写法一般是在
style标签里面如下,控制了div标签的宽高内容颜色。
<style>
div {
width: 300px;
height: 100px;
color: red;
}
</style>
js
- js全称JavaScript是一种脚本语言,它是连接前台(html)和后台服务器的桥梁,对网页行为进行编程,定义网页的行为
- 用自己话描述就是人的行为一样,例如要吃饭、要洗澡、要睡觉都是行为,js就是网页的一个行为,例如平时我们点击按钮就会弹出一个提示框、鼠标移入某个位置就会出现放大或者提示说明,这些都是js控制的结果。
- js一般都是在script标签里面写,都是一些逻辑处理,如下,则是一个js里面的基本函数,这个函数可以绑定到页面的任何一个地方,当点击这个按钮就会触发函数输出‘我点击了按钮’。
<script>
function onClickBut () {
console.log('我点击了按钮')
}
</script>
三者有何种关系呢?
- 作为一个完整的页面三者缺一不可,就像人一样,有了人的整体不可能不穿衣服吧?有了衣服不可能不用吃饭吧?或者只吃饭不穿衣服,好像也不正常吧?所以三者关系紧密相关
- 那三者我们应该怎么学习呢?我们应该怎么写?怎么记呢?
怎么学习三者?
- 我本人建议先记住上一章常用html标签,先知道标签的作用和布局先。因为html标签就是基础的基础,第一步必会的知识。
- 记住常用的标签,然后就可以开始使用css了,css需要学些什么呢?css和html其实一样,都需要记和背,css有固定的格式和固定的样式名称。例如:width:表示宽,height:表示高,color:表示文字颜色,background:表示元素的背景颜色。
- 最后就是学习js了,js是全部内容中最难的,也是最灵活多变的,所有业务逻辑基本都是在js里书写。这部分的话需要记语法和格式,要记的其实也不多,只是需要自己写很多逻辑。
css怎么控制html标签?
- 想要控制html标签,需要给标签一个class属性,class名称是固定的需要记住,例如:
<div class='header'></div>,class固定名称,class后面的自己命名,例如写成zhangshan或者abc都可以,只要是英文就行。 - 有了class属性之后,就到
style标签里面写自己想要写的内容,如果是class属性写样式格式必须是.开头,如果是标签的话格式就是标签名称。例如:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.div-color{
color: red;
}
div {
width: 400px;
height: 100px;
background: gray;
}
</style>
</head>
<body>
<div class="div-color">
<p>用css控制我是的文字红色</p>
</div>
</body>
<script></script>
</html>
- 学到这里基本算是html和css完成了一个阶段了,剩下的需要自己去记住和背熟常用的内容了
- js的话,这里就不说了,先把html和css会用先,才能一步一步的进步
学习网站(推荐)
- 这里介绍一个学习网站,菜鸟教程
- 学习基础的人基本可以在这个网站学习,有很多常用的html和css,也有js,相当于一个编辑工具放到网页,编写完后直接显示在页面,方便学习者练习操作。
总结
- 介绍了html、css、js是什么,三者关系是怎样的
- 需要记住html常用标签、css常用属性和格式
- 利用好推荐的教学网站
- 最后就是贵在坚持和多练习,才是成功的基本法宝