阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

      教程列表

      抓包专区
      测试专区

      CSS Text(文本)

      CSS 文本格式

      下面是文本的演示

      阿西河前端教程

      这是一个专注大前端领域技术探索的网站, 里面包括HTML/CSS—Nodejs等所有前端方面的技术整理, 如果有没有整理到的,欢迎联系我进行添加;

      代码如下

      <style>
          .demo-wrap{
              width: 96.5%; 
              border: 1px solid gray; 
              padding: 8px; 
              --darkreader-inline-border-top:#4c4c4c; 
              --darkreader-inline-border-right:#4c4c4c; 
              --darkreader-inline-border-bottom:#4c4c4c; 
              --darkreader-inline-border-left:#4c4c4c;
          }
          .demo-h1{
              text-align: center; 
              color: rgb(167, 201, 66); 
              --darkreader-inline-color:#bdd772;
          }
          .demo-p{
              text-indent:50px;
              text-align:justify;
              letter-spacing:3px
          }
      </style>
      <div class="demo-wrap" >
          <h1 class="demo-h1">阿西河前端教程</h1>
          <p class="demo-p">
          这是一个专注大前端领域技术探索的网站,
          里面包括HTML/CSS---Nodejs等所有前端方面的技术整理,
          如果有没有整理到的,欢迎联系我进行添加;
          </p>
      </div>
      

      文本颜色

      颜色属性被用来设置文字的颜色。

      颜色是通过CSS最经常的指定:

      • 十六进制值 - 如: #FF0000
      • 一个RGB值 - 如: RGB(255,0,0)
      • 颜色的名称 - 如: red

      一个网页的背景颜色是指在主体内的选择:

      body {color:red;}
      h1 {color:#00ff00;}
      h2 {color:rgb(255,0,0);}
      

      对于W3C标准的CSS:如果你定义了颜色属性,你还必须定义背景色属性。


      文本的对齐方式

      文本排列属性是用来设置文本的水平对齐方式。

      文本可居中或对齐到左或右,两端对齐.

      当text-align设置为”justify”,每一行被展开为宽度相等,左,右外边距是对齐(如杂志和报纸)。

      h1 {text-align:center;}
      p.date {text-align:right;}
      p.main {text-align:justify;}
      

      文本修饰

      text-decoration 属性用来设置或删除文本的装饰。

      从设计的角度看 text-decoration属性主要是用来删除链接的下划线:

      a {text-decoration:none;}
      

      也可以这样装饰文字:

      h1 {text-decoration:overline;}
      h2 {text-decoration:line-through;}
      h3 {text-decoration:underline;}
      

      我们不建议强调指出不是链接的文本,因为这常常混淆用户。


      文本转换

      文本转换属性是用来指定在一个文本中的大写和小写字母。

      可用于所有字句变成大写或小写字母,或每个单词的首字母大写。

      p.uppercase {text-transform:uppercase;}
      p.lowercase {text-transform:lowercase;}
      p.capitalize {text-transform:capitalize;}
      

      文本缩进

      文本缩进属性是用来指定文本的第一行的缩进。

      p {text-indent:50px;}
      

      所有CSS文本属性。

      属性描述
      color设置文本颜色
      direction设置文本方向。
      letter-spacing设置字符间距
      line-height设置行高
      text-align对齐元素中的文本
      text-decoration向文本添加修饰
      text-indent缩进元素中文本的首行
      text-shadow设置文本阴影
      text-transform控制元素中的字母
      unicode-bidi设置或返回文本是否被重写
      vertical-align设置元素的垂直对齐
      white-space设置元素中空白的处理方式
      word-spacing设置字间距
      卖前端学习教程

      只需几十元,就能买到培训班的内部教程!开启高薪之路!

      零基础小白阿里P7的教程都有!

      同时长期收购所有培训班的前端教程

      目录
      目录