编辑器使用、调试基本、html css基础

课前准备

  • 下载chrome浏览器
  • 下载sublime编辑器、或者Visual Studio Code、或者WebStrom。

编辑器使用

如何挑选编辑器:代码亮亮、轻快、丰富的插件支持、快捷键操作顺手、集成代码管理工具...

理解网页

网页是什么

  • 网页 = Html+CSS+JavaScript

  • Html: 网页元素内容

  • CSS: 控制网页样式

  • JavaScript:操作网页内容,实现功能或者效果

demo: html html+css html+css+javascript

一个基础网页

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>第1课</title>
  <style>
    h1{
        color: red;
    }
    p{
        background-color: #ff00ff;
    }
  </style>
</head>
<body>
  <h1>这里是标题</h1>
  <p>段落</p>
  <script>
    alert(1);
  </script>
</body>
</html>

代码

知识点

  • doctype
  • 网页编码

基本标签和样式

  • doctype html5: 说明是Html5的文档,必须有
  • html, head, body, title, style, script, h1, p
  • color(字体颜色): red(红色), #0000ff(蓝色)
  • background-color(背景颜色): black(黑色); 颜色参考1, 颜色名

注意点

  • 标签闭合

课下学习

  • 常见的浏览器有哪些,有哪些内核