CSS简介

CSS又称层叠样式表,实际上网页是一个嵌套的层叠结果,多层摞在一起,我们看到的只是最上面一层的样式。通过CSS,我们可以修改每一层的样式。

使用CSS修改元素样式的方式如下:

第一种方式(内联样式、行内样式),不推荐使用
1、在标签内通过style属性来设置元素的样式,以分号结尾。
2、缺点不利于复用,不利于维护

        <p style="color: red; font-size: 20px;">我在学习CSS样式</p>

第二种方式(内部样式表)
1、在head标签中,添加style标签,然后通过CSS样式选择器来为选中的元素设置样式,利于复用和维护。
2、缺点,内部样式表仅对当前网页起作用,不可夸网页复用。

 <style>
        p{
            color: red;
            font-size: 20px;
        }
    </style>

第三种方式(外部样式表),推荐使用
1、可以将CSS内容编写到一个外部的CSS文件中,然后通过link标签引入使用
2、有利于多个页面之间的复用,推荐使用
3、将样式表编写在外部样式表中,有利于使用浏览器的缓存机制,提升加载速度,提高用户体验。

    <link rel="stylesheet" href="style.css">

基础语法

1、注释: /* */
2、选择器 声明块
选择器:通过选择器可以选择页面中的指定元素,比如p的作用就是选择页面中所有的p元素
声明块:通过声明块来为选择器指定的元素设置样式,声明块由一个一个的声明组成,是一个明值对结构。

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

推荐阅读更多精彩内容

  • 一.我们为什么需要CSS? 使用css的目的就是让网页具有美观一致的页面,另外一个最重要的原因是内容与格式分离 在...
    前前前端小飞阅读 648评论 1 3
  • web前端开发通俗的讲就是做网页嘛,在浏览器上看到的所有静态页面以及各种特效都是前端开发出来的,想要入门web前端...
    Iris_mao阅读 524评论 0 13
  • 为网页添加样式 在head中的style标签内的就是css代码,使用css代码可以定义样式等CSS规则= 选择器 ...
    EndPein阅读 75评论 0 0
  • CSS是什么   CSS 指层叠样式表 (Cascading Style Sheets)。在第一篇文章中我们介绍到...
    甚得朕心阅读 214评论 0 1
  • CSS是什么 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素。 当浏览器...
    561561阅读 255评论 0 1