• PC端网页的基本构成


       首先,一个前端最基本的就是排网页,有人会看不起拍页面,认为不就是排一个页面嘛,有啥的,分分钟的事,可是他不知道的是,一个网页中也包含了很多内容,像我们如果不理解margin,padding,会经常对我们的页面造成困扰。

       言归正传,一个网页,由三个层构成:结构层(html)、表现层(css)、行为层(js)。接下来我们分别来介绍一下,以及我们在页面中怎么用和链接进页面。

       1>结构层(html):

        所谓的结构层就是一个框架,就想我们盖房子,得让这个房子的框架先出来。那么这个html的构成呢其实很简单,

     <!doctype html>

      <html lang="en">
        <head>
          <meta charset="UTF-8">
          <title>Document</title>

        </head>
        <body>

        </body>
     </html>

    那么,上面呢就是我们一个页面的基本结构,我们接下来就只需在<body></body>里放入我们所需的标签,这个我们后面再详细介绍。

       2>表现层(css)

       刚刚我们说了结构层是一个房子的框架,那么表现层(css)呢就是我们开始装扮一个房子,我们想让这个房子是蓝色的,还是紫色。想让她处于北面还是南面,给大家举个简单的例子:

    <div class="box"></div>

    .box{

      100px;height:100px;background:blue;

    }

       好,这个大括号里写的就是我们所说的样式,就是这个盒子她长什么样。那么box前面的这个点代表的是class名,这个后来我们慢慢解释。有人说我写了一大堆样式,必须要放在一个文件里吗,当然不是,而且我们也不建议这样做,因为这样会使页面的加载速度慢,那么我们可以把我们写的一大堆样式放在一个文件里,文件的后缀名为.css。那我们怎么和页面建立一个联系呢,我们这给大家说个标签link,她呢放在head里就可以,像这样<link rel="stylesheet" href="css/index.css">,index.css就是我们的css文件,也可以叫层叠样式表。

      其实,css放入html里有三种方式,第一种就是我们上面介绍的,外链,也是我们比较推荐的;第二种,内嵌,也就是style <style></style>。吧我们写好的样式放入里面就okay了,比如

        

      <style>

      .box{

        100px;height:100px;background:blue;

      }

      </style>

      第三种,行内,这种我们一般不推荐,写法很简单,<div style="100px;height:100px;background:blue;"></div>

       3>行为层(js)

       最后一个就是行为层(js),这个呢是最重要的一个,这个重要不仅仅指的是页面的一个重要部分,也是关于我们以后在前端道路上要重点发展的一个,这个还是希望大家要好好掌握,那他的链入方式和css和一样,比如 <script src="js/jquery.js"></script>

      那上面就是我们排一个最基本的构成,不要小看这些东西,每一个部分都需要我们不断的探索,才能在前端的道路上走的越来越稳。

  • 相关阅读:
    Python数据分析与爬虫
    Python例题集
    Python知识点复习
    Python内置函数---ord()
    关于Xpath
    初学爬虫(3)
    python操作csv文件
    初学爬虫(二)
    网络爬虫引发的问题及robots协议
    初学爬虫(一)
  • 原文地址:https://www.cnblogs.com/white-bull/p/6901513.html
Copyright © 2020-2023  润新知