html设置标题字体为楷体,标题部分背景为图片

html设置标题字体为楷体,标题部分背景为图片,第1张

方法/步骤分步阅读

1

/6

我们打开记事本 1709(OS 内部版本 18362.720)

进入下图界面

2

/6

我们首先把网页框架搭建起来

输入下图框内html代码

3

/6

接着我们输入下图框内代码

这个意思是使用css

css现在比较普遍

4

/6

接着我们要输入 css代码了

如下图框内

其中楷体就是我们设置的字体

5

/6

我们保存这个txt文件

然后修改为html格式

如下图框内

6

/6

然后我们打开网页文件,就可以了

标题的字体当在

\usepackage{caption2}

中使用

scriptsize,...,large

选项时,标题的标记和文本的字号均会相应的改变。而使用

up,

it,

sl,

sc,

md,

bf,

rm,

sf,

tt

选项时只作用于标题标记。

caption2

宏包也允许用户设定单独的标题字体。

\captionfont

命令可用来设定标题的字体(包括标记和文本),而命令

\captionlabelfont

则只设定标题标记的字体。因此若只想设定标题文本的字体,必须使用

\captionfont

来设定标题文本的字体,同时用

\captionlabelfont

来设定标题标记的字体,包括取消一些由

\captionfont

设置的字体属性。下面的命令可以有效的生成标题:{\captionfont%

{\captionlabelfont

\captionlabel

\captionlabeldelim}%

\captiontext}这里的

\captionlabel

命令生成标题标记,如

``图

1''。

\captionlabeldelim

生成标记与文本之间的分隔符

``:''。

\captiontext

则给出标题文本。

latex

的字体可用字号和三个式样:字形,字族和字体序列(见

[1,

37,115

页],

[3,

170-171

页])来描述。所有这四个字体特性均可用

\captionfont

\captionlabel

来指定。例如:\begin{figure}

\renewcommand{\captionfont}{\large

\bfseries

\sffamily}

\renewcommand{\captionlabelfont}{}

\centering

\includegraphics[width=2in]{graphic.eps}

\caption{test

caption}

\end{figure}结果如图

所示。在这个例子中,

\captionlabelfont

没有是空的,这意味着它没有改变标题缺省的字体属性和由命令

\captionfont

设定的标题标记的字体属性。由于没有给出字形,所以整个标题的字形为缺省的

upright

字体。

19.14

由下面的命令得到:\begin{figure}

\renewcommand{\captionfont}{\large

\bfseries

\sffamily}

\renewcommand{\captionlabelfont}{\small}

\centering

\includegraphics[width=2in]{graphic.eps}

\caption{test

caption}

\end{figure}在这个例子中,由

\captionlabelfont

给出的

\small

覆盖了由

\captionfont

指定的

\large

字号。不过,由于

\captionlabelfont

没有指定字体序列和字族,所以

\bfseries

\sffamily

也应用于标题标记。

方法和详细的 *** 作步骤如下:

1、第一步,如果要修改下划线的颜色,大小和其他样式,可以通过border属性设计,使用起来更灵活,见下图,转到下面的步骤。

2、第二步, 执行完上面的 *** 作之后, border-bottom属性用于设置底部边框样式,见下图,转到下面的步骤。

3、第三步,  执行完上面的 *** 作之后,border-bottom: #FF0000 2px solid ; 将边框大小设置为2PX红色边框,见下图,转到下面的步骤。

4、第四步,执行完上面的 *** 作之后,观察到相同的效果,发现下划线是整个屏幕的宽度,因此接下来将更改宽度,见下图,转到下面的步骤。

5、第五步,执行完上面的 *** 作之后,宽度设置为180px,可以根据实际情况进行调整,见下图,转到下面的步骤。

6、第六步,执行完上面的 *** 作之后,将显示下划线效果,见下图。这样,就解决了这个问题了。


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/zaji/6302449.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-20
下一篇 2023-03-20

发表评论

登录后才能评论

评论列表(0条)

保存