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 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...
随机推荐
- SQL从零到迅速精通【实用函数(1)】
语法是一个编程语言的基础,真的想玩的6得飞起还是要靠自己定义的函数和变量. 1.使用DECLARE语句创建int数据类型的名为@mycounter的局部变量,输入语句如下: DECLARE @myco ...
- 微信小程序获取手机号
wxml 代码: <!-- 授权 --> <button type="primary" open-type="getUserInfo" bin ...
- egg-multipart + el-upload 实现带参图片上传至阿里云OSS
egg-multipart有两种模式:file和stream el-upload参数传递有两种方式:利用自带参数data和手动添加参数 egg-multipart介绍 一.file 模式下的带参传递 ...
- Python入门随记(4)
在涉及一些实际问题,会碰到概率论等相关领域的知识,自然少不了矩阵运算,以下是Python中关于矩阵的简单操作: 1.常用库numpy import numpy as np 2.随机生成矩阵 a=np. ...
- git 回滚方式
git push 命用于从将本地的分支版本上传到远程并合并. 命令格式如下: git push <远程主机名> <本地分支名>:<远程分支名> 如果本地分支名与远程 ...
- java反射之java 泛型的本质
1.泛型 反射API用来生成在当前JAVA虚拟机中的类.接口或者对象的信息.Class类:反射的核心类,可以获取类的属性,方法等内容信息.Field类:Java.lang.reflect.表示类的属性 ...
- 活用Windows Server 2008系统的几种安全功能
与传统操作系统相比,Win2008系统的安全防范功能更加强大,安全防护能力自然也是高人一等,我们只要在平时善于使用该系统新增的各项安全防范功能,完全可以实现更高级别的安全保护目的.现在,本文就为大家贡 ...
- CentOS Stream 8 安装 Zabbix6.0 -- LNMP环境(nginx-1.20,mariadb-10.6,php-7.4)
镜像下载.域名解析.时间同步请点击阿里云开源镜像站 zabbix6.0 LTS版本出来了,前段时间刚安装了5.4,今天打算在虚拟机上安装6.0测试,安装6.0的要求php版本不低于7.2,mariad ...
- 6月28日 Django form组件 和 modelform组件
Form介绍 我们之前在HTML页面中利用form表单向后端提交数据时,都会写一些获取用户输入的标签并且用form标签把它们包起来. 与此同时我们在好多场景下都需要对用户的输入做校验,比如校验用户是否 ...
- 4月13日 python学习总结 组合与封装
一.组合 解决类与类之间代码冗余问题有两种解决方案:1.继承 2.组合 1.继承:描述的是类与类之间,什么是什么的关系 2.组合:描述的是类与类之间的关系,是一种什么有什么关系 一个类产生的 ...