zoukankan      html  css  js  c++  java
  • 6CSS之文本

    CSS文本:文本缩进(text-indent)、文本对齐(text-align)、文本修饰(text-decoration)、文本大小写(text-transform)、字符距离(letter-spacing)

    		<hr/>
    		<p id="pid">当时已经有过一些样式表语言的建议了,但CSS是第一个含有“层叠”的主意的。在CSS中,一个文件的样式可以从其它的样式表中继承下来。读者在有些地方可以使用他自己更喜欢的样式,在其他地方则继承,或“层叠”作者的样式。这种层叠的方式使作者和读者都可以灵活地加入自己的设计,混合各人的爱好。
    哈坤于1994年在芝加哥的一次会议上第一次展示了CSS的建议,1995年他与波斯一起再次展示这个建议。</p>
    		<hr/>
    
    		<!--
    			div#outer { 500px;}
    			div#inner {text-indent: 10%;}
    			#inner p{ 200px;}
    		-->
    		<div id="outer">
    			<div id="inner">some text. some text. some text.
    				<p>this is a paragragh.</p>
    			</div>
    		</div>
    		
    		<hr/>
    		<p id="pid2">当时已经有过一些样式表语言的建议了This is some text. This is some text</p>
    		<hr/>
    		<p id="pid3">
    		This              paragraph has    many    spaces           in it.
    		This              paragraph has    many    spaces           in it.<br/>
    		This              paragraph has    many    spaces           in it.</p>
    

      

    /*-----------------------------文本--------*/
    /*文本缩进*/
    p#pid{
    	text-indent:2em;/*em这个单位在文本缩进使用,效果更好*/
    }
    
    div#outer { 500px;}
    div#inner {text-indent: 10%;}
    #inner p{ 200px;}
    
    /*字间隔*/
    p#pid2{
    	word-spacing:2em;          /*word-spacing是表示单个英文单词之间的距离*/
    	/*letter-spacing: 1em;*/   /*letter-spacing是表示单个字符之间的距离*/
    }
    
    /*处理空白符*/
    p#pid3{
    	white-space: normal;	/*将多余的空格丢弃,去掉换行*/
    	/*white-space: pre;*/			/*将多余的空格与换行原样输出*/
    	/*white-space: nowrap;*/ 	 /*去掉所有换行,除非有br标签*/
    }
    

      

    ------------------------------------------------------------------------------------------------------------------------------

    -------------------------------------------------------------------------------------------

    -------------------------------------------------------------------------------------------

     

    -------------------------------------------------------------------------------------------

     

    -------------------------------------------------------------------------------------------

     

    -------------------------------------------------------------------------------------------

    #testId{
    	text-indent: 30px;/*由此可知,默认字体占15px或16px*/
    }
    
    #tdId{
    	/*text-decoration: underline; */
    	/*text-decoration: line-through;*//*删除线*/
    	text-decoration:overline;
    }
    
    #lsId{
    	letter-spacing: 10px;
    }
    
    #ttId{
    	text-transform:lowercase;
    }
    
    #uid{
    	text-transform: uppercase;
    }
    

      

    -------------------------------------------------------------------------------------------

  • 相关阅读:
    从csdn转移到博客园的一篇测试文章
    接口与抽象类的区别
    python网络爬虫进阶之HTTP原理,爬虫的基本原理,Cookies和代理介绍
    python验证码识别(2)极验滑动验证码识别
    VMWare虚拟机应用介绍
    Rpg maker mv角色扮演游戏制作大师简介
    python数据挖掘之数据探索第一篇
    python数据分析&挖掘,机器学习环境配置
    python爬取豆瓣视频信息代码
    python验证码处理(1)
  • 原文地址:https://www.cnblogs.com/1020182600HENG/p/6836801.html
Copyright © 2011-2022 走看看