HTML
超文本标记语言
作用
提供标记给浏览器,浏览器根据标记来识别。浏览器根据w3c组织规定的标记做出相应的解析。
超文本:体现在文字 图片 视频 数据流
HTML代码基本结构
根节点 两个子节点
graph
html--> head
html--> body
head-->title
head-->meta
网页编码格式
UTF-8 国际通用编码格式
建立网站基本结构
- 第一步建立一个文件夹作为网站项目的文件夹
JAVASCRIPT
-
一种脚本语言,用来控制网页上面的元素,元素是指HTML中的各种标签
-
前端开发:html5+div+css+js
网站首页
- index.html页面
- web服务器上面默认都有配置index.html index.htm来作为首页浏览
网站内容代码基本结构
`<body>
<div id="wrappar">
<div class="header"></div>
<div class="main"></div>
<div class="footer"></div>
</div>
</body>`
CSS结构规划
- 通用的css文件命名common.css 写通用css文件的好处,通过一次书写css,同时在多张页面生效
总结
- 掌握网站中css结构规则
- 网页开发的基本代码结构,写好后,往结构zhong填充即可 3.可能会出现多张页,这个时候我们应该要有一个相同意识的规划。
a标签
- 标签中间写链接的文字
- href属性:链接 3.target属性:打开页面的指向
SCRIPT 标记
控制网页上面html标签逻辑,称DOM控制
<html>
<head>
<meta charset="utf-8" />
<title>首页</title>
<link rel="stylesheet" type="text/css" href="css/main.css"/>
</head>
<body>
<div class="wrapper">
<div class="header">
<div class="logo" ">
编程
</div>
</div>
<div class="main">
<div id="pics">
<img src= 'img/a (1).jpg'>
</div>
</div>
<div class="fotter"></div>
</div>
</body>
</html>
<script src="js/main.js" type="text/javascript" charset="utf-8"></script>
margin: 0;
}
.logo{
color: aqua;
padding: 20px;
font-size: 18px;
background-color: darkgray;
}
.pics img{
width: 100%;
}
var n = 1;
//设置时钟控件
setInterval(function(){
if(n>4){
n=1
}
pics.innerHTML= "<img src= 'img/a%20("+n+").jpg'>"
n++
},1000) //1000毫秒
多写 多实践
function(){}:匿名函数,(没有名字的函数)可以直接被调用
setInterval(){}:定时器,参数一是函数,参数二是时间(毫秒)