首页 > 其他分享 >字体样式和文本样式

字体样式和文本样式

时间:2024-06-06 18:22:54浏览次数:17  
标签:font 样式 text align decoration 字体 文本

2.2字体样式

    /*
  font-family:字体
  font-weight:字体粗细
  font-size:字体大小
  color:字体颜色
  */
   <style>
       body{
           font-family: 楷体;
           color: red;
      }
       .p1{
         font-weight: bold;
      }
       h1{
           font-size: 100px;
      }
   </style>
</head>
<body>
<h1>故事介绍</h1>
<p class="p1">
  一个卖瓷碗的老人挑着扁担在路上走着,突然一个瓷碗掉到地上摔碎了,但是老人头也不回继续向前走。
  路人看到很奇怪,便问:“为什么你的碗摔碎了你却不看一下呢?”老人答到:“我再怎么回头看,碗是碎的。”
</p>
</body>

2.3 文本样式

1、颜色 color rgb rgba

2、文本对齐的方式 text-align =center

3、首行缩进 text-indent:2em

4、行高:line-height

5、装饰:text-decoration

6、文本图片水平对齐:vertical-align: middle;

    <style>
       h1{
           text-align: center;
      }
       .p1{
           text-indent: 2em;
      }
       .p3{
           background: rgba(0,255,255,0.1);
           height: 300px;
           line-height: 300px;
      }
       .l1{
           text-decoration:underline;
      }
       .l2{
           text-decoration: line-through;
      }
       .l3{
           text-decoration: overline;
      }
   </style>
</head>
<body>
<p class="l1">123456</p>
<p class="l2">123456</p>
<p class="l3">123456</p>
<h1>故事介绍</h1>
<p class="p1">
一个卖瓷碗的老人挑着扁担在路上走着,突然一个瓷碗掉到地上摔碎了,但是老人头也不回继续向前走。
路人看到很奇怪,便问:“为什么你的碗摔碎了你却不看一下呢?”老人答到:“我再怎么回头看,碗是碎的。”
</p>
<p class="p3">"I love you though my heart begs me to. Every romantic song reminds me of you, and every time I see a happy couple I wish they were you and me." </p>
<a href="image/360截图20240606180405978.jpg"></a>
<span>1234567</span>
</body>
    <style>
      span,img{
          vertical-align: middle;
      }
  </style>
</head>
<body>
<p><img src="image/360截图20240606180405978.jpg" alt=""><span>1234556</span></p>
</body>
 

标签:font,样式,text,align,decoration,字体,文本
From: https://www.cnblogs.com/huangjiangfei/p/18235777

相关文章

  • 【Python Cookbook】S01E22 替换文本 re.sub(),re.subn() 以及 回调函数
    目录问题解决方案讨论问题如果我们想要对字符串中的文本做替换,该如何办?解决方案针对简单的文本模式,我们直接使用字符串内置方法str.replace()函数即可。text="Ileaveamessageforyou."print(text.replace('leave','left'))结果:Ileftamessagefor......
  • AI写论文靠谱吗?探索自动化文本生成的可靠性
    众所周知,写论文是一项极其耗时间的事情,从开始的选题到文献资料搜索查阅,大纲整理等等一大堆的繁杂工作是极艰辛的。用AI写论文就不一样了,自动化生成文本为你节省了大量时间。优秀的AI工具生成的论文非常完备,能提供摘要、参考文献、致谢等材料参考,而且还查重率低,在5%左右。总体来......
  • 常见文本相似度计算方法简介:总结
    原文:文本相似度计算方法文本相似度计算方法:有2个关键组件,即【文本表示模型(文本切分粒度、特征构建方法)】和【相似度度量方法】。文本表示模型:将文本表示为计算机可以计算的数值向量,也就是提供特征。相似度度量方法:负责基于前面得到的数值向量计算文本之间的相似度。 文本......
  • JavaScript第十讲:DOM编程(1):节点概念,如何获取元素节点,节点属性,样式
    前言在当今的Web开发中,DOM(DocumentObjectModel)编程扮演着至关重要的角色。DOM是HTML和XML文档的编程接口,它使得我们可以像操作对象一样来操作网页上的元素。无论是构建动态网页,还是实现用户交互,都离不开对DOM的深入理解和灵活运用。在本文中,我们将开启DOM编程的系列学习之旅......
  • 最像真人的语音转文本ChatTTS本地部署+Colab部署+跳坑指南
    1.WindowsChatTTSUI:https://github.com/jianchang512/ChatTTS-ui/releases/tag/v0.85v0.85完整包下载(2.7G含模型)百度网盘下载: https://pan.baidu.com/s/1RntYLT6UNd8_ew2osy8d1A?pwd=by14123网盘下载:https://www.123pan.com/s/03Sxjv-oEyB3.htmlhuggingfacelink: h......
  • 【QT5】<总览二> QT信号槽、对象树及样式表
    文章目录前言一、QT信号与槽1.信号槽连接模型2.信号槽介绍3.自定义信号槽二、不使用UI文件编程三、QT的对象树四、添加资源文件五、样式表的使用六、QSS文件的使用前言承接【QT5】<总览一>QT环境搭建、快捷键及编程规范。若存在版权问题,请联系作者删除!一、QT......
  • 【SVG 生成系列论文(九)】如何通过文本生成 svg logo?IconShop 模型推理代码详解
    SVG生成系列论文(一)和SVG生成系列论文(二)分别介绍了StarVector的大致背景和详细的模型细节。SVG生成系列论文(三)和SVG生成系列论文(四)则分别介绍实验、数据集和数据增强细节。SVG生成系列论文(五)介绍了从光栅图像(如PNG、JPG格式)转换为矢量图形(如SVG、EPS格式)的关......
  • 导出谷歌地图提供的各类地图可视化样式的方法
      本文介绍在谷歌地图API(GoogleMapsAPIs)中,设计地图样式并将设计好的样式通过JSON或URL导出的方法。  首先,进入GoogleMapsAPIs网站。在弹出的窗口中我们可以看到,目前还可以基于谷歌云端硬盘进行地图样式设计;但原有的GoogleMapsAPIs其实相对来说也还是很方便、简洁的,本文......
  • 一键云部署:资源编排 ROS 轻松部署文本转语音系统 ChatTTS
    ChatTTS是专门为对话场景设计的文本转语音模型,例如LLM助手对话任务。它支持英文和中文两种语言。最大的模型使用了10万小时以上的中英文数据进行训练。ChatTTSwebUI&API为ChatTTS提供了网页界面和API服务。资源编排服务(ResourceOrchestrationService,ROS)是阿里云提供基......
  • 一周万星的文本转语音开源项目「GitHub 热点速览」
    上周的热门开源项目让我想起了「图灵测试」,测试者在不知道对面是机器还是人类的前提下随意提问,最后根据对方回复的内容,判断与他们交谈的是人还是计算机。如果无法分辨出回答者是机器还是人类,则说明机器已通过测试,具有人类的智力水平。​虽然现在大模型的回答还充满AI“味”,可......