一、CSS 发展历程

  从HTML被发明开始,样式就以各种形式存在。不同的浏览器结合它们各自的样式语言为用户提供页面效果的控制。最初的HTML只包含很少的显示属性。 随着HTML的成长,为了满足页面设计者的要求,HTML添加了很多显示功能。但是随着这些功能的增加,HTML变的越来越杂乱,而且HTML页面也越来越臃肿。于是CSS便诞生了。

二、CSS 是网页的美容师

  CSS的出现,让我们的网页更加丰富多彩。让HTML 专注去做结构呈现,而 CSS 则负责样式的实现。

三、CSS 初始 

  CSS(Cascading Style Sheets):CSS通常称为CSS样式表或层叠样式表(级联样式表),主要用于设置HTML页面中的文本内容(字体、大小、对齐方式等)、图片的外形(宽高、边框样式、边距等)以及版面的布局等外观显示样式。

  CSS以HTML为基础,提供了丰富的功能,如字体、颜色、背景的控制及整体排版等,而且还可以针对不同的浏览器设置不同的样式。

四、CSS 语法规则

  使用 CSS 时,要严格遵守 CSS 样式规则,只有熟练的使用 CSS 才能对网页更好的美化。

  语法:

  

   注意:

    1.选择器用于指定CSS样式作用的HTML对象,花括号内是对该对象设置的具体样式。

    2.属性和属性值以“键值对”的形式出现。

    3.属性是对指定的对象设置的样式属性,例如字体大小、文本颜色等。

    4.属性和属性值之间用英文“:”连接。

    5.多个“键值对”之间用英文“;”进行区分。可以用段落 和 表格的对齐的演示。

    6.css对换行不敏感,对空格也不敏感。但是一定要有标准的语法。冒号,分号都不能省略。

   

  更多的样式学习请参考这里:http://www.w3school.com.cn/css/index.asp

CSS 初识的更多相关文章

  1. 前端之CSS初识

    figure:last-child { margin-bottom: 0.5rem; } #write ol, #write ul { position: relative; } img { max- ...

  2. 0008 CSS初识(行内式、内部样式表、外部样式表)

    typora-copy-images-to: media 第01阶段.前端基础.CSS初识 CSS层叠样式表 学习目标 理解 css的目的作用 css的三种引入方式 应用 css三种引用方式的书写 通 ...

  3. CSS初识- 选择器 &背景& 浮动& 盒子模型

    # CSS初识-目标: > 1. 学会使用CSS选择器 > 2. 熟记CSS样式和外观属性 > 3. 熟练掌握CSS各种基础选择器 > 4. 熟练掌握CSS各种复合选择器 &g ...

  4. 2020年12月-第02阶段-前端基础-CSS初识

    CSS层叠样式表 理解 css的目的作用 css的三种引入方式 1.HTML的局限性 说起HTML,这其实是个非常单纯的家伙, 他只关注内容的语义, 比如`<h1>`表明这是一个大标题,用 ...

  5. 前端之常用标签和CSS初识

    外层div的宽度是100%,就是视口的大小,当视口被拉窄到小于内层div的宽度980px时,比如800px,此时 外层div宽度为800px,内层div宽度依然为980px,而css中只设置了外层di ...

  6. Normalize.css 初识

    一. 用来干嘛的 一个现代的.准备好了支持 HTML5 技术,并且要替代 CSS Reset 处理样式的理念. Normalize.css 使浏览器渲染所有元素更加一致,并且符合现代标准.它只是针对那 ...

  7. 51、css初识

    前端内容就分三部分html.css.javascript(js),对一个网页来说html相当于是一个裸体的人,css相当于给这个人穿上了衣服,javascript相当于给这个人赋予动作行为,今天我们要 ...

  8. 【CSS初识】

    一.CSS是什么? CSS是一种样式表语言,用于为HTML文档定义布局.例如,CSS涉及字体.颜色.边距.高度.宽度.背景图像.高级定位等方面. HTML用于结构化内容:CSS用于格式化结构化的内容. ...

  9. 第四章css初识

    1.CSS(层叠样式表) 2.CSS语法 选择器{ 属性名1:属性值1: 属性名2:属性值2: } 3.引用CSS的三种方式 第一种:行内样式 例:<a style="color:re ...

  10. CSS初识盒子

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. 19-C#笔记-多态性

    # 静态多态性 --- ## 1 函数重载 和C++一样. --- ## 2 运算符重载 public static operator public static Box operator+ (Box ...

  2. 部署zabbix服务端和客户端和网页

    一:安装zabbix服务端 1.部署准备 命令:iptables -F     #关闭防火墙命令:systemctl stop firewalld    #关闭防火墙 设置解析,自建yum源 命令:c ...

  3. T1 :最小值(min)题解 ——2019.10.15

    思路: 对于 % 30 的数据,可以想到一个 Dp 方程: 其中dp[i]表示分割[1,i]的最大答案 代码: #include<cstdio> #include<cstring&g ...

  4. 【可持久化0/1Trie】【P4735】最大异或和

    Description 给定一个长度为 \(n\) 的序列 \(A\),有 \(m\) 次操作,每次要么在序列尾部再添加一个数,将序列长度 \(n\) 加一,要么给进行一次查询,给定查询参数 \(l, ...

  5. Windows_pycharm下安装numpy

    https://blog.csdn.net/haishu_zheng/article/details/77489309 一.下载在网站https://pypi.python.org/pypi/nump ...

  6. 调用 redis 原子命令,保证多线程安全 的incr命令问题

    redis本身就是事件驱动模型,你incr递增好了,然后get获取判断一下是否超过次数 参考:如何用java实现redis incr的高并发计数器

  7. Python(三)对装饰器的理解

    装饰器是 Python 的一个重要部分,也是比较难理解和使用好的部分.下面对装饰器做一下简单整理 1. 前言 装饰器实际上是应用了设计模式里,装饰器模式的思想: 在不概念原有结构的情况下,添加新的功能 ...

  8. 在Github或Gitee上用hexo搭建个人博客

    安装nodejs环境查看node版本node -v 安装cnpmnpm install cnpm -g --registry=https://registry.npm.taobao.org 安装 He ...

  9. VS2019调试 asp.net core 2.2 出现《ANCM In-Process Handler Load Failure 发布后启动错误处理》处理

      从 google 出来的 github 上  AspNetCore issues 和 stackoverflow 搜到的,百度 博客园搜到的,CSDN 搜到的,统统设置了,不管用.   从这些问题 ...

  10. 模型区分度衡量指标-KS值

    1.KS值--学习器将正例和反例分开的能力,确定最好的“截断点” KS曲线和ROC曲线都用到了TPR,FPR.KS曲线是把TPR和FPR都作为纵坐标,而样本数作为横坐标.但是AUC只评价了模型的整体训 ...