CSS--开篇
- 1，什么是CSS?
层叠样式表(Cascading Style Sheet ),定义了如何显示HTML元素，用来控制网页的样式和布局。
引入CSS后：HTML标记专门用于定义网页的内容，而使用CSS来设置其显示效果。
CSS2.0是目前广泛使用的级联样式单规范。CSS2.0提供了一种机制，就是说让程序员开发的时候不考虑显示和页面，显示的问题有美工后期来解决。实际开发中一般都是先由美工写好页面，也就是静态的html，然后拿给程序员来用就OK。
下面是2个html，第1个没有使用css，第2个使用了css。
<html>
<head>
<title>Hello!</title>
</head>
<body>
<h2>通过样式表来改变网页外表</h2>
<p id="p1">欢迎来到CSS世界</p>
<div>css给我们带来丰富多彩的世界</div>
<br>
<div>人生本就充满了矛盾，任何人都无可奈何！</div>
</body>
</html>
<html>
<head>
<title>测试: 内部样式表</title>
<style type="text/css">
h2 {
color: red;
font-size: 46px;
font-family: 宋体;
} #p1 {
font-size: 30px;
background: blue;
font-family: 黑体;
}
.cs {
font-size: 20px;
background: green;
font-family: 黑体;
}
</style>
</head>
<body>
<h2>通过样式表来改变网页外表</h2>
<p id="p1">欢迎来到CSS世界</p>
<div class="cs">css给我们带来丰富多彩的世界</div>
<br>
<div class="cs">人生本就充满了矛盾，任何人都无可奈何！</div>
</body>
</html>
- 2，为什么要用CSS?
CSS的作用：表达效果丰富，文档体积小，便于信息检索，可读性好。
CSS的精髓：将页面内容和显示样式分离。
第一，简化网页的代码，提高访问速度。外部的CSS文件会被浏览器保存在缓存里，加快下载显示的速度，减少了需要上传的代码数量。
第二，便于维护。便于修改网站样式:只要修改css文件，就可改变整个网站的风格特色。避免一个个网页的修改，大大减少重复劳动的工作量，而且还可以重用样式。
第三，页面内容和显示样式分离。使得美工和程序员可以专注做自己删除的东西。
研究CSS，其实东西不多，毕竟我们不是专门的美工人员，大致有个了解就OK了，第1个就是CSS选择器，第2个就是常用的属性设置。
CSS--开篇的更多相关文章
- Matplotlib数据可视化（3）：文本与轴
在一幅图表中,文本.坐标轴和图像的是信息传递的核心,对着三者的设置是作图这最为关心的内容,在上一篇博客中虽然列举了一些设置方法,但没有进行深入介绍,本文以围绕如何对文本和坐标轴进行设置展开(对图像 ...
- CSS基础（一）：开篇
背景 HTML是一种超文本标记语言,用来定义文档的结构和内容,例如标题.段落和列表等等,而文档内容如何渲染.如何展示,这就需要样式来修饰了.CSS正是可以与HTML很好地结合.如果将HTML比作水,那 ...
- CSS布局开篇
原文: 简书原文:https://www.jianshu.com/p/2c78b927f8c4 开篇 这是我写CSS布局的第一篇文章,之所以将布局从中摘出来单独放一部分是因为我觉得光是布局这块内容就有 ...
- 重拾CSS基础—开篇
由来 从事软件行业一晃也5年有余,之间参与过若干个基于web的项目,所以javascript和Html基本已经相当熟悉,最近对于web前端开发比较关注,分析后发现CSS的确是自己的弱项,于是决定再加强 ...
- 11种常用css样式之开篇文本字体学习
常见css样式:1.字体与颜色2.背景属性3.文本属性4.边框属性5.鼠标光标属性6.列表样式7.定位属性8.内外边距9.浮动和清除浮动10.滚动条11.显示和隐藏 文本:1.letter-spaci ...
- Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引
因为内容比较多,所以每篇讲解一些内容,最后会放出全部代码,可以参考.操作中总会遇到各式各样的问题,个人对部分问题的研究在最后一篇 问题研究 里.欢迎大家探讨学习. 代码都经过个人测试,但仍可能有各种未 ...
- 一起学习jQuery2.0.3源码—1.开篇
write less,do more jQuery告诉我们:牛逼的代码不仅精简而且高效! 2006年1月由美国人John Resig在纽约的barcamp发布了jQuery,吸引了来自世界各地众多Ja ...
- 转载css的background-position
这是一个有趣的话题 其实我并不确切的平时大家是怎么去应用或者玩转一个属性,一个值.我能肯定的是这些东西都有不少的可玩性. 我今天要聊的 background-position 应该已经被大家玩得色彩斑 ...
- 利用target的特性，可以实现纯css的tab效果切换
基础知识: :target起作用的是href连接到的位置 如 <a href="#tab1">tab1</a> <div id="tab1& ...
- 举例详解CSS中的cursor属性
这篇文章主要举例介绍了CSS中的cursor属性,包括zoom-in/zoom-out和grab/grabbing等常用属性值的使用,需要的朋友可以参考下 一.开篇之言 CSS3的领域范围已经渗透到了 ...
随机推荐
- linux 安装redis4.0.6
1.进入/usr/local/src目录,下载redis # cd /usr/local/src# wget http://download.redis.io/releases/redis-4.0.6 ...
- java socket 和.net socket 通讯 demo
结束符协议"##" import java.io.BufferedReader; import java.io.IOException; import java.io.InputS ...
- Centos7下配置Python3和Python2共存，以及对应版本Ipython安装配置
1.查看是否已经安装Python Centos7默认安装了python2.7.5 因为一些命令要用它比如yum 它使用的是python2.7.5. 使用python -V命令查看一下是否安装Pytho ...
- 管理 MariaDB 用户账户
哪些用户可以连接到MariaDB 服务器,他们都可以从哪些地方连接,连接到服务器后又能够做什么等,都是本文将涉及到的内容. 用户的权限信息都保存在 mysql 库中的几个权限表中.对 MariaDB ...
- 实体处理模块IEntityModule
在2015年7月16日,XCode新增了实体处理模块IEntityModule,用于拦截实体对象添删改操作. 该接口参考IHttpModule设计理念,横切在实体对象的关键生命周期之中,以达到多实体类 ...
- tty各种设备的情况
通常使用tty来简称各种类型的终端设备. (1)串口端口终端(/dev/ttySn) 串行端口终端(Serial Port Terminal)是使用计算机串行端口连接的终端设备.计算机把每个串行端口都 ...
- 常见的VPS虚拟化架构：OpenVZ、Xen、Hyper-V、KVM、VMWare OpenVZ
OpenVZ OpenVZ特点是,它是直接调用母服务器的内核,所以会导致部分软件无法使用,以及部分内核文件是无法修改. OpenVZ适用人群:新手.低预算客户 OpenVZ注意事项:资源不是自己独有的 ...
- Django的生命周期图解
下边的图就是一次完整的django生命周期,从客户端输入url,经过wsgi模块处理,得到符合HTTP协议的字符串,走中间件,假如中间件return None,继续往下走到urls......; 假如 ...
- 枚举 输入流重载>> C++
语言:C++ 我们可能会遇到这种情况:自己定义了一个枚举类型,但是却不知道如何重载输入流,使我们定义的枚举用起来不是很方便. 那么,如何去重载呢,我们先来看一下内置类型的测试过程: #include& ...
- 树和二叉树的存储结构的实现(C/C++实现)
存档: #include <iostream.h> #include <stdio.h> #include <stdlib.h> #define max 20 ty ...