第一次写这么完整的html网页….完全的手打
<!--告知浏览器这是H5文档 -->
<!DOCTYPE html>
<!--html是整个文档的基本标签,也是跟标签-->
<html>
<!--head描述整个文档的信息-->
<head>
<!--元信息标签,设置文档的基本描述信息,这里charset是设置编码-->
<meta charset="utf-8">
<!--title标签0所设置的内容会显示在浏览器的标签页上-->
<!--概括中心思想-->
<title>the fist one </title>
<!--style标签,写css样式-->
<style>
h1{
/*设置颜色*/
color: violet;
/*背景颜色*/
background-color: green;
/*设置宽度,大小是px像素*/
width:200px;
}
p{
color: darkmagenta;
}
</style>
</head>
<!--body标签,显示内容在浏览器上 -->
<body>
<!--标题标签,h2到h6-->
<!--onmousemove 鼠标移动到上面的时候-->
<!--onmouseout 鼠标移动走-->
<h1 onmousemove="h1_move()" onmouseout="h1_out()"> hahahahaha </h1>
<!--p段落标签-->
<p onclick="p_click()" ondblclick=""> 就是这样</p>
<!--script 写javascrip代码-->
<script>
// var是声明变量的关键字,document是js定义的一个全局文本对象
// queryselector 使用这个方法就能在js代码中找到html标签
var h1_object=document.querySelector('h1');
var p_object=document.querySelector('h1');
// 这里声明一个函数或者方法,声明的关键字是function
function h1_move(){
h1_object.style.width='1000px';
}
function h1_out(){
h1_object.style.width='400px';
}
var i=1;
function p_click(){
// p_object.style.color='yellow';
if(i%2==0)
{
p_object.style.color='purple';
}
else{
p_object.style.color='aliceblue';
}
i++;
}
</script>
</body>
</html>
很简单的一个网页,就是备注多,适合初学者