CSS+DIV网页样式与布局--文字样式&段落_html/css_WEB-ITnose
一个网页要说最多的还是文字,上篇博客说CSS样式是一个网页的精髓,那网页中最直接表现出来的就是文字和图片,还有一些所谓的表单,首先先说最为熟悉和常用的文字。让CSS控制网页中的文字,使它不再那么枯燥平淡,从此网页文字变得绚丽多彩。
一、文字样式
文字样式主要包括文字的大小、颜色、字体等,具体包括如下
写一个小例子,综合运用上述所有的文字效果样式:
代码:
<title>文字字体</title><style>body{background-color:#99CCFF;}h2{font-family:楷体_GB2312, "Times New Roman";}h3{ font-family:"宋体";}p.bigsize {font-size: 0.5in;}p.smallsize {font-size: 0.5cm;}p.bluecolor { color:#00CCFF;}p.yellowcolor { color:#FFFF66;}p.bold{ font-weight:bold;}p.Italic{ font-weight:bold; font-style:italic;}.line{ text-decoration:underline;}.line1{ text-decoration:blink;}.line3{ text-decoration:line-through;}.line4{ text-decoration:overline;}.zuozhe1{ text-transform:capitalize;/* 单词首字大写 */ }.zuozhe2{ text-transform:uppercase; /* 全部大写 */ }.zuozhe3{ text-transform:lowercase; /* 全部小写 */ }.joy{ color:#CC33CC;}</style> <h2 id="人群中哭着-楷体">人群中哭着-----楷体</h2> <h3 id="你只想变成透明的颜色-宋体">你只想变成透明的颜色-----宋体</h3> <p class="bigsize">五月天 <span class="joy">你不是真正的快乐</span></p> <p class="smallsize"> 阿信</p> <p class="bluecolor">你再不回梦或痛或心动了-----蓝色</p> <p class="yellowcolor">你已经决定了 你已经决定了-----黄色</p> <p class="bold">你已经决定了-----文字粗细:粗体</p> <p class="Italic">你静静忍着-----文字粗细+斜体</p> <span class="line">紧紧把昨天在拳心握着-----下划线</span><br><span class="line1">而回忆越是甜就是越伤人-----文字的闪烁</span><br><span class="line3"> 文字的删除线</span><br><span class="line4">越是在手心留下密密麻麻深深浅浅的刀割-----顶划线</span> <br><br><span class="zuozhe1">作者: Claribel (英文字母首字母大写)</span><span class="zuozhe2"> 作者: Claribel (英文字母全部大写)</span><span class="zuozhe3"> 作者: Claribel (英文字母全部小写)</span>
运行效果:
二、文字段落
对于文字的段落来说,一篇文章要想清晰有条理的展示给读者,有一个条理分明的段落样式是非常必要的,接下来就说明一下文字段落的一些常用样式。具体详情请参考下篇博客: CSS+DIV网页样式与布局??文字样式&段落 (二)

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

本文讨论了HTML&lt; Progress&gt;元素,其目的,样式和与&lt; meter&gt;元素。主要重点是使用&lt; progress&gt;为了完成任务和LT;仪表&gt;对于stati

本文讨论了html&lt; datalist&gt;元素,通过提供自动完整建议,改善用户体验并减少错误来增强表格。Character计数:159

本文讨论了HTML&lt; meter&gt;元素,用于在一个范围内显示标量或分数值及其在Web开发中的常见应用。它区分了&lt; meter&gt;从&lt; progress&gt;和前

本文讨论了视口元标签,这对于移动设备上的响应式Web设计至关重要。它解释了如何正确使用确保最佳的内容缩放和用户交互,而滥用可能会导致设计和可访问性问题。

本文讨论了使用HTML5表单验证属性,例如必需的,图案,最小,最大和长度限制,以直接在浏览器中验证用户输入。

本文解释了HTML5&lt; time&gt;语义日期/时间表示的元素。 它强调了DateTime属性对机器可读性(ISO 8601格式)的重要性,并在人类可读文本旁边,增强Accessibilit

本文讨论了&lt; iframe&gt;将外部内容嵌入网页,其常见用途,安全风险以及诸如对象标签和API等替代方案的目的。
