写一个拥有CSS的简单网页(第二节课)

一个最简单的网页一定要有一样东西,就是下面这段代码。不管它是什么,复制这段内容到文本文件,在把你的文本文件的文件名改为html,双击就可以打开了。打开以后什么都没有是正常的。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>这个里面是填写你网站的名字</title>
</head>

<body>

</body>

</html>

CSS按照要求得写在style标签内,再被head标签包裹

<head>
<style>
 // 写在这个里面
</style>
</head> 

HTML按照要求需要写在

<body>
   // 写在这个里面
</body>

接下来我修改下HTML代码,如下是修改完成的代码,看不懂没事:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>这个里面是填写你网站的名字</title>
    <style>
        span {
            color: brown;
            font-size: 50px;
        }
    </style>
</head>

<body>
    <span>我爱你,橘子和柠檬。</span>
</body>

</html>

你一定像我一样修改文本文件,不要直接复制它。改完以后如果是下图的效果,说明你是正确的。


Snipaste_2019-11-24_20-04-52.png

总结:

这节课一定记住上面加黑的东西
CSS样式写在哪里? HTML样式写在哪里?*
如果你全部掌握了,恭喜你,你可以进入接下来的课程。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 本文主要是起笔记的作用,内容来自慕课网. 认识CSS样式 CSS全称为“层叠样式表 (Cascading Styl...
    0o冻僵的企鹅o0阅读 2,662评论 0 30
  • CSS基础 本文包括CSS基础知识选择器(重要!!!)继承、特殊性、层叠、重要性CSS格式化排版单位和值盒模型浮动...
    廖少少阅读 3,158评论 0 40
  • 本课来自http://www.imooc.com/learn/9请不要用作商业用途。 HTML5 HTML介绍 H...
    PYLON阅读 3,307评论 0 5
  • CSS全称为“层叠样式表 (Cascading Style Sheets)”,它主要是用于定义HTML内容在浏览器...
    百作不死的学习阅读 1,210评论 0 7
  • 浏览器与服务器的基本概念 浏览器(安装在电脑里面的一个软件) 作用: ①将网页内容渲染呈现给用户查看。 ②让用户通...
    云还灬阅读 1,154评论 0 0