首页 > 代码库 > 自学H5第一天笔记
自学H5第一天笔记
1.web前端开发工程师
1.web前端开发工程师是做什么的
要与网站打交道
2.成为一名web前端开发工程师需要具备的条件
1、兴趣
2、敲代码
3.web前端开发需要学习什么
1、软件
浏览器:有非常多种-常用的:谷歌(推荐) 火狐 IE
浏览器调试工具:option + command + j(MAC) F12(windows)
编辑器:hBuilder（推荐-国产）下载地址:http://www.dcloud.io/、sublime、dreamever
PS:
2、语言
HTML CSS JavaScript
==========HTML============
超文本标记语言 (结构)
标签:<html> </html> <meta/> 文本:
==========CSS=============
层叠样式表 （样式）
style="width: 200px ;height: 300px;background: red;"
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<title>--标题--</title>
</head>
<body>
我的第一个网页
<div style="width: 200px ;height: 300px;border: 2px solid red;background: url(https://10.url.cn/qqcourse_logo_ng/ajNVdqHZLLDpYFkeOp4Q6pFbNJ4u326Al1uzPkAWXccHkmreK0YeFnXC0UCxk4IpFvmlk3xFqUc/220?tp=webp);">这是一个方块</div>
</body>
</html>
==========JavaScript=========
脚本语言 (行为)
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<title>--标题--</title>
</head>
<body>
我的第一个网页
<div onclick="this.style.width=‘800px‘;this.style.height=‘500px‘;" style="width: 200px ;height: 300px;border: 2px solid red;background:
url(https://10.url.cn/qqcourse_logo_ng/ajNVdqHZLLDpYFkeOp4Q6pFbNJ4u326Al1uzPkAWXccHkmreK0YeFnXC0UCxk4IpFvmlk3xFqUc/220?tp=webp);">这是一个方块</div>
</body>
</html>
============HBuild工具的使用===========
=================================
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
作者：15910776643@163.com
时间：2016-09-17
描述：CSS出现的位置:1、行间 2、内部 3、外部
1、行间样式表：给单独的标签添加样式
语法：<div style="width:100px;"></div>
缺点：不利于修改
2、内部样式表
-->
<div style="width: 100px;height: 100px;background: red;">
div1
</div>
<div>div2</div>
</body>
</html>
================================
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
div{
width: 100px;
height: 100px;
background: pink;
}
</style>
</head>
<body>
<!--
作者：15910776643@163.com
时间：2016-09-17
描述：内部样式:样式表写在一个html文件里面
语法：把样式写在一对<style></style>标签队中，这个标签对是放在html页面里面的
缺点：内部样式表的作用范围只存在当前的页面
-->
<div></div>
</body>
</html>
自学H5第一天笔记