跳转到主要内容
你行网

Main navigation

  • 首页
  • Drupal
  • 编程与开发
  • 数据库
  • 操作系统与应用
  • 服务器与运维
  • 社区
User account menu
  • 登录

面包屑

  1. 首页

CSS 基础学习-078 css 设置文本格式化样式

由 hrs, 8 十月, 2021

 

text-align:设置文本对齐方式,其值有:center 居中对齐,left 左对齐, right右对齐

text-indent:设置段落缩进值。例如:我们要把文本段落缩进两个中文字符,可以设置:text-indent:2em;

text-transform:设置字母字体的大小写样式。其值有:

值 描述
none 默认。定义带有小写字母和大写字母的标准的文本。
capitalize 文本中的每个单词以大写字母开头。
uppercase 定义仅有大写字母。
lowercase 定义无大写字母,仅有小写字母。
inherit 规定应该从父元素继承 text-transform 属性的值。

letter-spacing 属性增加或减少字符间的空白(字符间距)

值 描述
normal 默认。规定字符间没有额外的空间。
length 定义字符间的固定空间(允许使用负值)。
inherit 规定应该从父元素继承 letter-spacing 属性的值。

实例代码:

<!doctype html>
<html>
  <head>
    <style>
      div{
        border:1px solid;
        padding:10px;
        width:600px;
      }   
    
    h1{ 
        color:green;
        text-align:center;
        text-transform:uppercase;/*改变字母大写*/

      }   
      a{  
        color:lightskyblue;
        text-decoration:none; /* 设置链接没有下划线*/    
      }   
      p{  
        text-align:center;
        text-indent:2em;
        letter-spacing:10px;/*改变内容字体间距大小*/
      }   
    
    </style>
  </head>
  <body>
    <div>
      <h1>this is a h1 title</h1>
      <p>这是一个文本段落,这是一个文本段落,这是一个文本段落,这是一个文本段落,这是一个文本段落,这
是一个文本段落,这是一个文本段落,这是一个文本段落,这是一个文本段落,这是一个文本段落,这是一个文本>段落,这是一个文本段落,这是一个文本段落,这是一个文本段落,这是一个文本段落,这是一个文本段落,这是>一个文本段落,这是一个文本段落,这是一个文本段落,这是一个文本段落,是一个文本段落,这是一个文本段落>,<a href="https://www.dwoke.com">"你行网"</a> 链接</p>
    </div>
  </body>
</html>

运行效果:

css-078.png

 

  • 登录或注册以发表评论

文章标签

  • CSS

评论

文章标签

CSS
Excel
ubuntu
php
vim
五笔
Linux
VPN
command
HTML
drupal 8
drupal 7
centos
composer
Mysql
模块(module)
drush
Drupal
JavaSrcipt
apache
drupal 9
英语
nerdtree
SEO
network
果树种植
surround
drupal10
主题(theme)
ssh
phpmyadmin
yum
二进制
权限
声音
ssl
selinux
HTML5
WireGuard
password
Dreamweaver
DDEV
flameshot
翻译
颜色
uploadprogress
邮件验证
firewalld
kernel
视图(views)
快捷键
xdebug
gzip
错误
电脑基础
ckeditor
C语言
简介
源地址
mbstring
certbot
php扩展
git
csharp
httpd
apt
电子秤
压缩解压
breadcrumb
表单
短信验证
AI
firmware
摄影
diff
superfish
重定向
drupal 11
网站备份
docker
版本号
tagclouds
java
RSS
adsense
KVM
电脑技巧
端口
simple_adsense
算法
youtube
JavaScript
cookie
badblocks
计算机基础
网站运营
RFID
VUE
zip
dns
标签优化
gimp
form
mod_expires 模块
赚钱
ip
http验证
curl
重定向,301
netstat
字段
maven
input
nginx
哈希值
npm
wps
更多

相关文章

  • 如何去掉input和button标签中间有缝隙
  • CSS 基础学习-254 css使用 opacity 定义颜色
  • CSS 基础学习-253 css使用用 HSL 值定义颜色
  • CSS 基础学习-252 css使用RGBA 值定义颜色
  • CSS 基础学习-251 css使用background-clip属性
  • CSS 基础学习-250 css使用background-origin属性
  • CSS 基础学习-249 css使用不同的属性来创建背景图像
  • CSS 基础学习-248 css全尺寸背景图像
  • CSS 基础学习-247 css使用多个背景图像
  • CSS 基础学习-246 css使用contain和cover设置背景图像
RSS源

友情链接 网站地图 版权信息 联系我们 网址导航 社区

Copyright © 2019 - 2021 你行网 版权所有  粤ICP备19072650号