CSS简单样式练习（五）
运行效果：
源代码：
1 <!DOCTYPE html>
2 <html lang="zh">
3 <head>
4 <meta charset="UTF-8">
5 <title>春天</title>
6 <style type="text/css">
7
8 *{
9 margin: 0;
10 padding: 0;
11 border: none;
12 }
13
14 body{
15 font-family: "宋体";
16 font-size: 12px;
17 }
18
19 .title{
20 font-size: 16px;
21 font-weight: bolder;
22 text-decoration: overline;
23 }
24
25 .container{
26 margin: 20px 20px;
27 height: 300px;
28 }
29
30 .text-content{
31 margin-top: 20px;
32 }
33
34 .green{
35 color: limegreen;
36 }
37
38 .red{
39 color: red;
40 }
41
42 .text-center{
43 text-align: center;
44 }
45 </style>
46 </head>
47 <body>
48 <div class="container">
49 <p class="red text-center title">春天</p>
50 <p class="green text-content"> 在<font class="red">春季</font>，地球的北半球开始倾向太阳，
51 受到越来越多的太阳光直射，因而气温开始升高。随着冰雪消融，河流水位上涨。<font class="red">春季</font>植物
52 开始发芽生长，许多鲜花开放。冬眠的动物苏醒，许多以卵过冬的动物孵化，鸟类开始迁徙，
53 离开越冬地向繁殖地进发。许多动物在这段时间里发情，因此中国也将<font class="red">春季</font>称为“万物复苏”
54 的季节。<font class="red">春季</font>气温和生物界的变化对人的心理和生理也有影响。</p>
55 </div>
56 </body>
57 </html>
CSS简单样式练习（五）的更多相关文章
- CSS简单样式练习（七）
运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta char ...
- CSS简单样式练习（六）
运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta char ...
- CSS简单样式练习（四）
运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta char ...
- CSS简单样式练习（三）
运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta char ...
- CSS简单样式练习（二）
运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta char ...
- CSS简单样式练习（一）
运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta char ...
- 前端学习日记之HTML、CSS 简单总结
前端学习日记之HTML.CSS 简单总结 标签(空格分隔): html css 前端学习日记 html超文本标记语言 一. h标题标签 h1-h7 <!DOCTYPE html> < ...
- CSS常用样式及示例
CSS常用样式及示例 一.简介 层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集) ...
- 谈谈一些有趣的CSS题目（十五）-- 奇妙的 background-clip: text
开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...
随机推荐
- php 23种设计模式 - 责任链模式
责任链模式 责任链模式(Chain of Responsibility Pattern)为请求创建了一个接收者对象的链.这种模式给予请求的类型,对请求的发送者和接收者进行解耦.这种类型的设计模式属于行 ...
- Mysql备份方案总结性梳理
Mysql备份方案总结性梳理 服务器 mysql 日志 数据库 配置 Mariadb binlog mysql数据库备份有多么重要已不需过多赘述了,废话不多说!以下总结了mysql数据库的几种 ...
- java8中CompletableFuture的使用介绍
既然CompletableFuture类实现了CompletionStage接口,首先我们需要理解这个接口的契约.它代表了一个特定的计算的阶段,可以同步或者异步的被完成.你可以把它看成一个计算流水线上 ...
- spring——AOP(静态代理、动态代理、AOP)
一.代理模式 代理模式的分类: 静态代理 动态代理 从租房子开始讲起:中介与房东有同一的目标在于租房 1.静态代理 静态代理角色分析: 抽象角色:一般使用接口或者抽象类来实现(这里为租房接口) pub ...
- python写一个web目录扫描器
用到的模块urliib error #coding = utf-8 #web目录扫描器 by qianxiao996 #博客地址:https://blog.csdn.net/qq_36374896 i ...
- xssgame记录
xss地址:http://www.xssgame.com/ 直接插入标签 构造语句,注意闭合 注意寻找输出点,这个会进行一次urlencode,和浏览器有关系,firefox过不了 javascrip ...
- python 命令行参数学习（二）
照着例子看看打打,码了就会.写了个命令行参数调用进行运算的脚本. 参考文章链接:http://www.jianshu.com/p/a50aead61319 #-*-coding:utf-8-*- __ ...
- 实践丨SpringBoot整合Mybatis-Plus项目存在Mapper时报错
摘要:在SpringBoot运行测试Mybatis-Plus测试的时候报错的问题分析与修复 本文分享自华为云社区<SpringBoot整合MybatisPlus项目存在Mapper时运行报错的问 ...
- Spark—GraphX编程指南
Spark系列面试题 Spark面试题(一) Spark面试题(二) Spark面试题(三) Spark面试题(四) Spark面试题(五)--数据倾斜调优 Spark面试题(六)--Spark资源调 ...
- 浅析memcmp 和 strcmp
eg: #include <stdio.h> #include <string.h> int main(void) { char string[7] = "ABCDE ...