HTML网页制作:[17]CSS常用样式字体及颜色属性

CSS在网页中应用非常广泛,今天我就来分享一些关于文本的CSS样式属性。一起来学习一下吧!

操作方法

  • 01

    如图,比如我们有一段文字hello html!。

  • 02

    然后在浏览器中预览一下最初始的效果。

  • 03

    然后我们在网页中添加style标签,从而设置CSS样式。

  • 04

    如图,书写标签名加花括号,这里我使用的是p标签。如果你用的是其他标签,则修改为其他标签。

  • 05

    接着书写书写font-family,font-family是关于字体的属性,这里我设置成微软雅黑,你也可以设置成楷体,隶书等,注意要带上双引号哦。

  • 06

    接着再来预览,可以看到字体变成微软雅黑了哦。

  • 07

    再来书写属性font-size,这个属性是设置文本的大小的。这里我就设置成36px,px表示像素。数值越大则文字越大。

  • 08

    接着预览效果,就会发觉字号变大了。

  • 09

    接着设置font-style,这个属性是设置文本的风格,我设置的是斜体italic,默认是normal。

  • 10

    接着预览效果可以看到文字变成斜体了哦。

  • 11

    设置文本是否为粗体可以用属性font-weight,这里我设置为bolder,或者也可以设置成bold。

  • 12

    这样文字就会加粗了。

  • 13

    而color这个属性可以设置文本的颜色,这里我就设置成red红色了。你也可以设置成blue蓝色,orange橙色,pink粉色等。

  • 14

    最后,网页文本变成红色的了。

  • 15

    贴出源代码可以参考参考。 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> <style type="text/css"> p{ font-family: "微软雅黑"; font-size: 36px; font-style: normal; font-weight: bolder; color: red; } </style> </head> <body> <p>hello html!</p> </body> </html>

(0)

相关推荐

  • DW CS3网页制作之CSS布局规则

    DW CS3网页制作之CSS布局规则 步骤/方法 01 CSS文件的链接方式 ·附加链接:外部CSS文件 ·导入CSS:常用应用多个CSS文件时,将多个CSS导入一个CSS文件中 02 CSS规则定义 ...

  • 网页制作新手怎么设置字体

    字体(Font)的设置是网页制作新手遇到的第一个难点. 如何控制字体大小,如何取消超链接字体的下划线是网友来信问得最多的.好,我们来彻底研究一下字体的各个方面:字符集的设定. 在查看html文件原代码 ...

  • html css javascript网页制作教程

    html css javascript网页制作教程!下面,小编以编写一个简单的html+css+javascript网页,来给大家介绍一下html css javascript网页制作的方法. 操作方 ...

  • 网页制作常用代码汇总

    网页制作常用代码汇总 操作方法 01 文字加粗 倾斜的代码: 文字加粗的代码是: <b>你好</b>;文字倾斜的代码是: <i>你好!</i>;底线字: ...

  • dreamweaver网页制作样式表的建立关联到页面

    dreamweaver网页制作时,如何将样式表达的建立关联到页面,里面详细的步骤和方法都在视频中有讲解,希望能认证听讲我 操作方法 01 首先简单的搭建好页面的站点 02 建立以个文件夹,列如css, ...

  • 网页设计\网页制作常用软件分享

    一.专业的网页设计.网页制作软件: 1.CorelDraw:通过CorelDRAW9的全方面的设计及网页功能融合到现有的设计方案中,制作矢量的插图.设计及图像,出色地设计公司标志.简报.彩页.手册.产 ...

  • 常用的绘图和网页制作软件有哪些

    常用的绘图和网页制作软件有哪些 步骤/方法 01 coreldraw.freehand功能差不多.说专业排版不能完全说明其作用.我感觉最能表现其功能的是:它们都是矢量图(勾线很好用). 02 Auto ...

  • Dreamweaver网页设计里CSS样式表怎么添加

    在网页设计中,CSS是用于控制页面元素外观布局的样式表,怎么创建一个新的CSS样式表并修改属性参数呢,下面让我们来看看具体怎么操作. 操作方法 01 首先我创建了一个网页在里面输入的"演示文 ...

  • 网页制作教程-文本字体大小设置

    今天介绍网页中如何控制文字的显示大小. 操作方法 01 使用文本编辑器创建一个html文件,并进行编辑,输入html基本要素.若此步有问题,请阅读小编的"网页制作教程-Hello, worl ...