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;
    }
    

      

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

  • 相关阅读:
    LeetCode 382. Linked List Random Node
    LeetCode 398. Random Pick Index
    LeetCode 1002. Find Common Characters
    LeetCode 498. Diagonal Traverse
    LeetCode 825. Friends Of Appropriate Ages
    LeetCode 824. Goat Latin
    LeetCode 896. Monotonic Array
    LeetCode 987. Vertical Order Traversal of a Binary Tree
    LeetCode 689. Maximum Sum of 3 Non-Overlapping Subarrays
    LeetCode 636. Exclusive Time of Functions
  • 原文地址:https://www.cnblogs.com/1020182600HENG/p/6836801.html
Copyright © 2011-2022 走看看