*/
* Copyright (c) 2016,烟台大学计算机与控制工程学院
* All rights reserved.
* 文件名:text.cpp
* 作者:常轩
* 微信公众号:Worldhello
* 完成日期:2016年8月5日
* 版本号:V1.0
* 程序输入:无
* 程序输出:见运行结果
*/

CSS样式

CSS全称为“层叠样式表 (Cascading Style Sheets)”,它主要是用于定义HTML内容在浏览器内的显示样式,如文字大小、颜色、字体加粗等。

如下列代码:

p{

font-size:12px;

color:red;

font-weight:bold;

}

使用CSS样式的一个好处是通过定义某个样式,可以让不同网页位置的文字有着统一的字体、字号或者颜色等。

CSS样式的优势

为什么使用css样式来设置网页的外观样式呢?有一段文字,我们想把“超酷的互联网”、“服务及时贴心”、“有趣”这三个短语的文本颜色设置为红色,这时就
可以通过设置样式来设置,而且只需要编写一条css样式语句。

第一步:把这三个短语用<span></span>括起来。

第二步:写入下列代码:

span{

color:red;

}

例:

<span>超酷的互联网</span>

<span>服务及时贴心</span>

<span>有趣</span>

然后所选中的文字就会变红。

CSS代码语法

css 样式由选择符和声明组成,而声明又由属性和值组成,如下图所示:

选择符:又称选择器,指明网页中要应用样式规则的元素,如本例中是网页中所有的段(p)的文字将变成蓝色,而其他的元素(如ol)不会受到影响。

声明:在英文大括号“{}”中的的就是声明,属性和值之间用英文冒号“:”分隔。当有多条声明时,中间可以英文分号“;”分隔,如下所示:

p{font-size:12px;color:red;}

注意:

1、最后一条声明可以没有分号,但是为了以后修改方便,一般也加上分号。

2、为了使用样式更加容易阅读,可以将每条代码写在一个新行内,如下所示:

p{

font-size:12px;

color:red;

}

CSS注释代码

就像在Html的注释一样,在CSS中也有注释语句:用/*注释语句*/来标明(Html中使用<!--注释语句-->)。就像下面代码:

CSS——NO.1(初识CSS)的更多相关文章

  1. 初识CSS

    css解释 css样式: css是英文Cascading Style Sheets的缩写,称为层叠样式表,用于对页面进行美化,CSS的可以使页面更加的美观.基本上所有的html页面都或多或少的使用cs ...

  2. #WEB安全基础 : HTML/CSS | 0x1初识CSS

    "我受够这些难看的网页了,我怎么才能让它变得好看点?"你说. 我答道:"看来你得学点CSS了" 学习这些东西只有一个原则,就是用你的脑袋想,用你的眼睛看,用的你 ...

  3. web前端基础——初识CSS

    1 CSS概要 CSS(Cascading Style Sheets)称为层叠样式表,用于美化页面(单纯HTML写的页面只是网页框架和内容的组合,相当于赤裸的人,而CSS则是给赤裸的人穿上华丽的外衣) ...

  4. 前端基础 & 初识CSS

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

  5. 前端开发css实战:使用css制作网页中的多级菜单

    前端开发css实战:使用css制作网页中的多级菜单 在日常工作中,大家都会遇到一些显示隐藏类菜单,比如页头导航.二维码显示隐藏.文本提示等等......而这些效果都是可以使用纯css实现的(而且非常简 ...

  6. CSS3与页面布局学习笔记(五)——Web Font与CSS Sprites(又称CSS精灵、雪碧图)技术

    一.web font web font是应用在web中的一种字体技术,在CSS中使用font-face定义新的字体.先了解操作系统中的字体: a).安装好操作系统后,会默认安装一些字体,这些字体文件描 ...

  7. [css]我要用css画幅画(九) - Apple Logo

    接着之前的[css]我要用css画幅画(八) - Hello Kitty,这次画的是苹果公司的logo 这次打算将分析和实现步骤尽量详细的说一说. 其实之前的也打算详细讲分析和设计过程,不过之前的图比 ...

  8. [css]我要用css画幅画(八) - Hello Kitty

    接着之前的[css]我要用css画幅画(七) - 哆啦A梦,这次画的是Hello Kitty. /* 开始前先说点废话, 一转眼就2016年了,过完年后一直没更新博客,无他,就是懒得动. 这一转眼,一 ...

  9. [css]我要用css画幅画(七) - 哆啦A梦

    接着之前的[css]我要用css画幅画(六),今天画的有所不同,画的是哆啦A梦,我们小时候对他的称呼其实是小叮当机器猫. (PS:这次我要做的事情,很多人已经做过,这并不是什么创新,我只是在学习并记录 ...

  10. [css]我要用css画幅画(六)

    接着之前的[css]我要用css画幅画(五), 由于这个画已经画了很久了,这次一次性加了比较多更新,算是让这幅画告一段落吧. 本次的更新包括: 1. 给云增加动画 2. 画了一棵树 3. 树上画了一个 ...

随机推荐

  1. matlab2016b

    http://www.cnblogs.com/CQBZOIer-zyy/p/5933954.html

  2. 887A. Div. 64#模特的数学技巧(字符串处理)

    问题出处:http://codeforces.com/problemset/problem/887/A 问题大意:对于给出的一串二进制数,能否通过去掉一些数字,使之成为十进制下64的倍数 #inclu ...

  3. bzoj1396识别子串(SAM+线段树)

    复习SAM板子啦!考前刷水有益身心健康当然这不是板子题/水题…… 很容易发现只在i位置出现的串一定是个前缀串.那么对答案的贡献分成两部分:一部分是len[x]-fa~len[x]的这部分贡献会是r-l ...

  4. liquibase 注意事项

    liquibase 一个changelog中有多个sql语句时,如果后边报错,前边的sql执行成功后是不会回滚的,所以最好分开写sql <changeSet author="lihao ...

  5. UIView 的Transform属性以及 CGAffineTransform的使用

    什么是Transform? Transform是一个3×3的矩阵,如下图所示: 通过这个矩阵我们可以对一个坐标系统进行缩放,平移,旋转以及这两者的任意组着操作.而且矩阵的操作不具备交换律,即矩阵的操作 ...

  6. 实验报告8 AC+Fit AP组网通过三层网络注册(DHCP Option 43)

    实验报告8 课程名称 无线网络与安全技术 实验名称 AC+Fit AP组网通过三层网络注册(DHCP Option 43) 姓名 学号 班级 实 验 目 的   [实验目的] 了解AC+Fit AP跨 ...

  7. hdu2876 Connections between cities(LCA倍增)

    图不一定联通,所以用并查集找各个联通块的祖先分别建图,之后就和LCA的步骤差不多了 #include<iostream> #include<cstring> #include& ...

  8. springboot+mybatis登录注册

    接上上一篇博客的继续往下做,上一篇已经实现了mybatis自动生成代码,和连接数据库测试部分 本篇我们添加一些功能,实现登录注册,时间原因,前端实现的很粗糙,以后有时间再改吧 首先看一下数据库的构成, ...

  9. Critical-Value|Critical-Value Approach to Hypothesis Testing

    9.2 Critical-Value Approach to Hypothesis Testing example: 对于mean 值 275 的假设: 有一个关于sample mean的distri ...

  10. 乐观锁(Optimistic Lock)

    乐观锁(非阻塞)指不通过锁表来解决并发问题,一般情况下表数据都会加入一个version字段,对该字段进行比较更新来保证数据的一致性. 这里写了个demo,应该可以说明乐观锁的问题. public cl ...