码迷,mamicode.com
首页 > 其他好文 > 详细

文本样式

时间:2018-10-11 23:46:03      阅读:143      评论:0      收藏:0      [点我收藏+]

标签:enter   一个   justify   文本   type   upper   字符   字母   删除线   


<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>postion</title>
        <style>
            .p1{
                /*
                 *text-transform可以用来设置文本的大小写
                 * 可选值:
                 * none 默认值,该怎么显示就怎么显示,不做任何处理
                 * capitalize 单词的首字母大写,通过空格来识别单词
                 * uppercase 所有的字母都大写
                 * lowercase 所有的字母都小写
                 *  */
                text-transform:lowercase;    
                /*letter-spacing 设置字符间距*/
                /*letter-spacing:20px;*/
                /*Word-spacing 设置字与字之间距,其实就是通过空格来识别单词*/
                /*word-spacing: 20px;    */    
            }
            .p2{
                /*
                 *text-decoration:设置文本修饰
                 * 可选值:
                 *        none:默认值
                 *      underline:下划线
                 *         overline:上划线
                 *      line-through:删除线
                 */
                text-decoration:line-through;
            }
            a{
                /*超链接默认下划线(即:他的text-decoration的默认值是underline)*/
                text-decoration:none;
            }
            .p4{
                /*text-align:用来设置文本对齐方式
                 * 可选值:
                 * left 默认值,文本靠左对齐
                 * right:文本靠右对齐
                 * center: 文本居中对齐
                 * justify:两端对齐
                 *         -调整文本之间的空格的大小,来达到一个两端对齐的一个目的的
                 */
                text-align: center;
            }
            .p3{
                /*text-indent首行缩进
                 *em:字体大小,1em是1个字体大小
                 * 当给他一个正值时,会自动向右侧缩进指定像素
                 * 当给他一个负值时,会自动向左侧缩进指定像素(通过这方式可以一些不想显示的文字隐藏起来)
                 *
                 */
                text-indent: 2em;
            }
            
        </style>
    </head>
    <body>
        <p class="p4">Man is now facing a big problem省略which is becoming more and more serious.</p>
        <p class="p3">有些面试者给我的答案直接说没有比较大的挑战;这个让我感觉这个人可能没有听懂我的问题,工作那么多年,难道没有一个项目可以拿来说的,那我拿什么来判定你的能力呢?</p>
        <a href="#">我是一个超链接</a>
        <p class="p2">文本修饰</p>
        <p class="p1">Man is now facing a big problem省略which is becoming more and more serious.</p>    
        
    </body>
</html>

文本样式

标签:enter   一个   justify   文本   type   upper   字符   字母   删除线   

原文地址:https://www.cnblogs.com/goodgirl----xiaomei/p/9775483.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!