CSS介绍

我们为什么需要CSS?

使用css的目的就是让网页具有美观一致的页面,另外一个最重要的原因是内容与格式分离 在没有CSS之前,我们想要修改HTML标签的样式需要为每个HTML标签单独定义样式属性,当HTML内容非常多时,就会定义很多重复的样式属性,并且修改的时候需要逐个修改,费心费力。是时候做出改变了,所以CSS就出现了。

CSS的出现解决了下面两个问题:

  1. 将HTML页面的内容与样式分离。
  2. 提高web开发的工作效率。

什么是CSS?

CSS是指层叠样式表(Cascading Style Sheets),样式定义如何显示HTML元素,样式通常又会存在于样式表中。也就是说把HTML标签的样式都统一收集起来写在一个地方或一个CSS文件里。

当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化(渲染)。

css的优势

1.CSS将网页内容和显示样式进行分离(使数据和显示分开)

2.网页的表现统一,容易修改

3.丰富的样式,使页面布局更加灵活

4.减少网页的代码量,增加网页浏览器速度,节省网络带宽

5.运用独立页面的css,有利于网页被搜索引擎收录

6.使开发效率提高了

如何使用CSS?

我们通常会把样式规则的内容都保存在CSS文件中,此时该CSS文件被称为外部样式表,然后在HTML文件中通过link标签引用该CSS文件即可。这样浏览器在解析到该link标签的时候就会加载该CSS文件,并按照该文件中的样式规则渲染HTML文件。

前端 CSS 介绍的更多相关文章

  1. 前端 CSS 目录

    前端 CSS 介绍 前端 CSS语法 前端 CSS 注释

  2. 前端学习之路-CSS介绍,Html介绍,JavaScript介绍

    CSS介绍 学前端必备掌握CSS样式,css为层叠样式表,用来定义页面的显示效果,加强用户的体验乐趣,那么如何用css到html中呢? style属性方式 利用标签中的style属性来改变显示样式 & ...

  3. 前端基础之css介绍

    CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素. 当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化(渲染). CSS语法 CSS实例 ...

  4. 前端之CSS介绍

    CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素. 当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化(渲染). CSS的语法 CSS语 ...

  5. 百万年薪python之路 -- 前端CSS基础介绍

    一. CSS介绍 CSS定义 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 语法结构 div{ color: green ...

  6. 扯一扯前端css的整体架构设计:(2)base基础类的那些事儿

    周一下午在实验室写了第一篇博文,有几个人捧场,那咱就得接着下去啊.然后我觉得现在写的内容更多的偏向于谈一下我对于前端css架构的理解和前端经验的一个小总结,所以就把标题里原来的[项目总结]给删掉了.但 ...

  7. web前端(2)—— 前端技术介绍

    前端技术 前文了解了什么是前端,那么前端技术到底有哪些呢?最核心的就这三个: html/html5 css/css3 javascript 什么是HTML HyperText Markup Langu ...

  8. {前端CSS} 语法 Css的几种引入方式 css选择器 选择器的优先级 CSS属性相关 背景属性 边框 CSS盒子模型 清除浮动 overflow溢出属性  定位(position)z-index

    前端CSS CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表来对文 ...

  9. day 45 前端CSS

      前端CSS   CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式 ...

随机推荐

  1. hdu4507 数位dp+推公式

    推公式的能力需要锻炼.. /* dp的时候要存结构体 里面三个元素: cnt,就是满足条件的个数 sum1,就是满足条件的数字和 sum2,满足条件的数字平方和 推导过程:还是用记忆化搜索模板 dp[ ...

  2. 爬虫高性能 asyncio库 twisted库 tornado库

    一 背景知识 爬虫的本质就是一个socket客户端与服务端的通信过程,如果我们有多个url待爬取,只用一个线程且采用串行的方式执行,那只能等待爬取一个结束后才能继续下一个,效率会非常低. 需要强调的是 ...

  3. 利用web.py快速搭建网页helloworld

    访问web.py官网 http://webpy.org/ 根据网站步骤,利用 pip install web.py 若没有 PIP 则先安装pip 运行 sudo apt-get install py ...

  4. 天梯赛 L1-043 阅览室

    L1-043 阅览室 (20 分) 天梯图书阅览室请你编写一个简单的图书借阅统计程序.当读者借书时,管理员输入书号并按下S键,程序开始计时:当读者还书时,管理员输入书号并按下E键,程序结束计时.书号为 ...

  5. OK Titlefasdf asd

    Do a lot of material ! asdfa sdgadfasdg Android  is ok, IOS is also ok.

  6. Android+openCV 的坑

    之前一直用IntelliJ IDEA 导入 opencv_android_sdk 的 java 包,在最后一步finish时,始终出错. 后来重新安装Android Studio 重复以上步骤,能顺利 ...

  7. spark MLlib DataType ML中的数据类型

    package ML.DataType; import org.apache.spark.SparkConf; import org.apache.spark.api.java.JavaRDD; im ...

  8. html+css+js整体布局——[防止浏览器扩大,界面排版混乱]

    1,body——>width:100% body { background-color: rgb(238, 238, 238); color: rgb(51, 51, 51); display: ...

  9. python接口测试-认识POST请求

    上午和一个大神交流了一下,给我了一点建议:多做笔记,勤复盘:及时记录自己,最好的提升不是来自于别人,而是来自于自身.我觉得挺有道理的,分享出来.共勉 说正事. 今天把post请求的大概内容看了一下.虽 ...

  10. jdbc和odbc

    JDBC简介 JDBC(Java Data Base Connectivity,java数据库连接)是一种用于执行SQL语句的Java API,它是Java十三个规范之一.可以为多种关系数据库提供统一 ...