HTML&CSS基础-文本样式

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　作者：尹正杰

版权声明：原创作品，谢绝转载！否则将追究法律责任。

一.HTML源代码

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>文本样式</title>

        <style type="text/css">

            .p1{

                /**

                 *     text-transform可以用来设置文本的大小写,有以下可选值:

                 *         none:

                 *             默认值，该怎么显示就怎么显示，不做任何处理

                 *         capitalize:

                 *             单词的首字母大写，通过空格来识别单词

                 *         uppercase:

                 *             所有的字母都大写

                 *         lowercase:

                 *             所有的字母都小写

                 */

                text-transform: lowercase;

            }

            .p2{

                /**

                 *     text-decoration可以用来设置文本的修饰，有以下可选值:

                 *         none:

                 *             默认值，不添加任何修饰，正常显示

                 *         underline:

                 *             为文本添加下划线

                 *         overline:

                 *             为文本添加上划线

                 *         line-through:

                 *             为文本添加删除线

                 */

                text-decoration: line-through;

            }

            a{

                /**

                 *     超链接会默认添加下划线，也就是超链接的text-decoration的默认值时underline，如果需要去除掉超链接的下划线则需要将该样式设置为none

                 */

                text-decoration: none;

            }

            .p3{

                /**

                 *     letter-spacing：

                 *         可以指定字符间距

                 *     word-spacing:

                 *         可以设置单词之间的距离，实际上就是设置词与词之间空格的大小

                 *

                 */

                letter-spacing: 10px;

                word-spacing: 50px;

            }

            .p4{

                /**

                 *     text-align用于设置文本的对齐方式，有以下可选值:

                 *         left:

                 *             默认值，文本靠左对齐。

                 *         right:

                 *             文本靠右对齐

                 *         center:

                 *             居中对齐

                 *         justify:

                 *             两端对齐，实际上是通过调整文本之间的空格大小，来达到一个两端对齐的目的

                 */

                text-align:justify;

            }

            .p5{

                /**

                 *     字体默认大小时16px

                 */

                font-size: 20px;

                /**

                 *     text-indent用来设置首行缩进:

                 *         当给它指定一个正值时，会自动向右缩进指定的像素，我们设置为2em时，不管字体大小怎么变化，都会留出两个字符空间的。

                 *         如果给它指定一个负值时,则会向左移动指定的像素,通过这种方式可以将一些不想显示的文字隐藏起来

                 *

                 */

                text-indent: 2em;

            }

        </style>

    </head>

    <body>

        <a href="#">我是超链接</a>

        <p class="p1">The Apache Hadoop software library is a framework that allows for the distributed processing of large data sets across clusters of computers using simple programming models. It is designed to scale up from single servers to thousands of machines, each offering local computation and storage. Rather than rely on hardware to deliver high-availability, the library itself is designed to detect and handle failures at the application layer, so delivering a highly-available service on top of a cluster of computers, each of which may be prone to failures.</p>

        <p class="p2">The Apache Hadoop software library is a framework that allows for the distributed processing of large data sets across clusters of computers using simple programming models. It is designed to scale up from single servers to thousands of machines, each offering local computation and storage. Rather than rely on hardware to deliver high-availability, the library itself is designed to detect and handle failures at the application layer, so delivering a highly-available service on top of a cluster of computers, each of which may be prone to failures.</p>

        <p class="p3">The Apache Hadoop software library is a framework that allows for the distributed processing of large data sets across clusters of computers using simple programming models. It is designed to scale up from single servers to thousands of machines, each offering local computation and storage. Rather than rely on hardware to deliver high-availability, the library itself is designed to detect and handle failures at the application layer, so delivering a highly-available service on top of a cluster of computers, each of which may be prone to failures.</p>

        <p class="p4">The Apache Hadoop software library is a framework that allows for the distributed processing of large data sets across clusters of computers using simple programming models. It is designed to scale up from single servers to thousands of machines, each offering local computation and storage. Rather than rely on hardware to deliver high-availability, the library itself is designed to detect and handle failures at the application layer, so delivering a highly-available service on top of a cluster of computers, each of which may be prone to failures.</p>

        <p class="p5">

            噫吁嚱，危乎高哉！蜀道之难，难于上青天！蚕丛及鱼凫，开国何茫然！尔来四万八千岁，不与秦塞通人烟。西当太白有鸟道，可以横绝峨眉巅。地崩山摧壮士死，然后天梯石栈相钩连。上有六龙回日之高标，下有冲波逆折之回川。黄鹤之飞尚不得过，猿猱欲度愁攀援。青泥何盘盘，百步九折萦岩峦。扪参历井仰胁息，以手抚膺坐长叹。问君西游何时还？畏途巉岩不可攀。但见悲鸟号古木，雄飞雌从绕林间。又闻子规啼夜月，愁空山。蜀道之难，难于上青天，使人听此凋朱颜！连峰去天不盈尺，枯松倒挂倚绝壁。飞湍瀑流争喧豗，砯崖转石万壑雷。其险也如此，嗟尔远道之人胡为乎来哉！剑阁峥嵘而崔嵬，一夫当关，万夫莫开。所守或匪亲，化为狼与豺。朝避猛虎，夕避长蛇；磨牙吮血，杀人如麻。锦城虽云乐，不如早还家。蜀道之难，难于上青天，侧身西望长咨嗟！

        </p>

    </body>

</html>

二.浏览器打开以上代码渲染结果

python自动化运维之路~DAY8的更多相关文章

  1. python自动化运维之路~DAY5

    python自动化运维之路~DAY5 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.模块的分类 模块,用一砣代码实现了某个功能的代码集合. 类似于函数式编程和面向过程编程,函数 ...

  2. 《Python自动化运维之路》 业务服务监控(二)

    文件内容差异对比方法 使用diffie模块实现文件内容差异对比.dmib作为 Python的标准库模块,无需安装,作用是对比文本之间的差异,且支持输出可读性比较强的HTML文档,与 Linux下的di ...

  3. Python自动化运维之路-01

    python的主要应用 python的擅长领域 学python有没有前途?python的语言排名 语言选择 运维会了开发后可以干什么? python的最大优势就是什么都能做. 课程概述 毕业目标 周五 ...

  4. 【Python自动化运维之路Day9】Socket

    socket也可以认为是套接字是一种源IP地址和目的IP地址以及源端口号和目的端口号的组合.网络化的应用程序在开始任何通讯之前都必须要创建套接字.就像电话的插口一样,没有它就没办法通讯. socket ...

  5. 【Python自动化运维之路Day7】

    1. configparser模块 import configparser config = configparser.ConfigParser() #先把config应用一下configparser ...

  6. 【Python自动化运维之路Day6】

    1.递归思考题,阶乘 使用递归方式(函数)计算: 1*2*3*4*5*6*7*8*9*10的值 def func(num): if num==1: return 1 return num*func(n ...

  7. 【Python自动化运维之路Day4】

    abs()  取绝对值all()  所有为真,则为真,否则为假any()  至少有一个为真,就为真,否则为假callable()   判断函数是否可以被调用,如果可以返回True,否则返回False ...

  8. 【Python自动化运维之路Day2】

    1. 常量命名规则 在Python中,会在变量命名上标明某变量是常量,通常采用全是大写的方式来标明,如: CONNECT= '127.0.0.1' PORT = ' 2.Python编译 python ...

  9. 《Python自动化运维之路》 系统基础信息模块(一)

    系统性能收集模块Psutil 目录: 系统性能信息模块psutil 系统性能信息模块psutil psutil能够轻松实现获取系统运行的进程和系统利用率包括(CPU,内存,磁盘 和网络)等.主要用于系 ...

随机推荐

  1. java — 静态绑定和动态绑定

    绑定:一个方法的调用与方法所在的类关联起来.java中的绑定分为静态绑定和动态绑定,又被称作前期绑定和后期绑定. 静态绑定:(final.static.private)在程序执行前已经被绑定,也就是说 ...

  2. 自定义视图（SpringMVC）

    一.首先理解视图的解析过程 1)请求处理方法执行完成后,最终返回一个 ModelAndView 对象. ModelAndView 对象,它包含了逻辑名(访问URL)和模型对象(javaBean数据)的 ...

  3. ubuntu在windows下的wubi安装

    转自:http://mp.weixin.qq.com/s?__biz=MjM5NjYxNjU0OQ==&mid=200664819&idx=2&sn=25719890570b1 ...

  4. 使用docker-compose 大杀器来部署服务

    使用docker-compose 大杀器来部署服务 上 我们都听过或者用过 docker,然而使用方式却是仅仅用手动的方式,这样去操作 docker 还是很原始. 好吧,可能在小白的眼中噼里啪啦的对着 ...

  5. 【Java集合的详细研究4】Java中如何遍历Map对象的4种方法

    方法一 通过Map.entrySet遍历key和value,在for-each循环中使用entries来遍历.推荐,尤其是容量大时 这是最常见的并且在大多数情况下也是最可取的遍历方式.在键值都需要时使 ...

  6. [转帖] linux下面 vim 数字键无法插入的解决办法

    感谢原作者: https://blog.csdn.net/guoyuqi0554/article/details/11477597 这个问题困扰自己好久了.. 刚才解决了 rlwrap的问题 这会儿 ...

  7. C++与C的区别

    在最开始C++只是C加上了一些面向对象的特性,C++最初的名字为C with Classes.后来C++又提出了一些不同于Class的特性:Exceptions(异常).templates(模板).S ...

  8. hive视图

    简化复杂的查询 员工好.姓名.月薪.年薪.在一个emp表中; 部门名称在dept的表中;并未年薪起了一个名字annlsal 查询视图 视图是一个虚表,是不存数据的

  9. Kivy 中文教程 实例入门 简易画板 (Simple Paint App)：3. 随机颜色及清除按钮

    1. 随机颜色 通过前面的教程,咪博士已经带大家实现了画板的绘图功能.但是,现在画板只能画出黄色的图案,还十分单调,接下来咪博士就教大家,如何使用随机颜色,让画板变得五彩斑斓. 改进后的代码如下: f ...

  10. delphi 通过事务插入数据

    orsn1.StartTransaction; try qry1.Sql.Clear; qry1.Sql.Text:=' select * from log '; qry1.Open; qry1.In ...