這裡蒐索程式師資訊,查找有用的技術資料
当前位置:首页 » 网页前端 » web字体标题
扩展阅读
webinf下怎么引入js 2023-08-31 21:54:13
堡垒机怎么打开web 2023-08-31 21:54:11

web字体标题

发布时间: 2022-08-19 17:20:27

⑴ Web页面的字体有哪些

是这样的,手机的屏幕有大有小,移动web最好做成响应式布局,也就是自适应屏幕,没有固定宽高,这样的话,在所有手机上都可以正常显示。ico的话可以使用字体图标,现在大部分手机浏览器都支持html5和css3的。

⑵ Word文档中带Web格式的字体怎么修改

alhagi的回答是对的。但根据你描述的:拷到记事本里都没用,那我就不清楚了。
我的分析如下:拷回记事本,肯定会把所有格式去掉的。你再拷回来又重新出现,说明是word的问题。
那么解决办法可能如下:你把格式带到了word里面,你把文字拷走,格式还在。所以你需要重新建一个空白文档,再从记事本里拷到空白文档里,应该不会再出现了。
试试吧。完毕。

⑶ web端的设计中,标题性文字通常以多少号字体以上为主

中文网站一般默认就是宋体跟微软雅黑,因为你的电脑上面的字体别的电脑上面不一定有,而宋体、微软雅黑基本上是 Windows 自带字体,如果考虑到用户体验,所以尽量避免用一些系统本身没有的字体。

英文网站一律是 Verdana。
下面是常用默认字体的呈现及用法:
中易宋体(SimSun,TrueType),又叫简体中文:Win最常见的字体,小字体点阵,大字体TrueType,但是大字体并不好看,所以最好别做标题。
微软雅黑:Vista之后新引入的字体,打开Cleartype之后显示效果不错,不开Cleartype发虚。

Verdana:是一套无衬线字体,它在小字上有结构清晰端整、阅读辨识容易等高品质表现,成为许多领域爱用的标准字型之一。
华文细黑:Mac下的默认中文。
Droid Sans和衍生的WenQuanYi Microhei:Andriod中的中文,也是Linux绝大多数发行版本的默认中文,,当然也有用WenQuanyi Zenhei的,不过比较少了。

⑷ 如何WEB中把字体加粗

我不太清楚你到底要做什么,你贴出来的三段代码,分别表示了三段不同的 区隔标记 ,而且后两段都没有结束区域的符号,三段中也没有内容或文字,所以不知道你是想在哪一个区域把哪些文字加粗。
如果你是自己做网页,使用HTML语言,Dreamweaver里面的功能轻轻松松可以帮你实现你要的操作。
如果你是在浏览网页是看人家的源代码,你即使修改了,也只能在自己本地浏览啊,那何不用Dreamweaver打开更方便。

最后,认真回答你的问题。<DIV align="center"><FONT face="宋体"><strong>你要输入的字</strong></FONT></DIV> 是没错的,“你要输入的字”就是被加粗的部分,并在这个区域内被居中。

给你提供一些HTML代码,自己研究下吧。

标记 类型 译名或意义 作 用 备注
文件标记
<HTML> ● 文件声明 让浏览器知道这是 HTML 文件
<HEAD> ● 开头 提供文件整体资讯
<TITLE> ● 标题 定义文件标题,将显示于浏览顶端
<BODY> ● 本文 设计文件格式及内文所在
排版标记
<!--注解--> ○ 说明标记 为文件加上说明,但不被显示
<P> ○ 段落标记 为字、画、表格等之间留一空白行
<BR> ○ 换行标记 令字、画、表格等显示于下一行
<HR> ○ 水平线 插入一条水平线
<CENTER> ● 居中 令字、画、表格等显示于中间 反对
<PRE> ● 预设格式 令文件按照原始码的排列方式显示
<DIV> ● 区隔标记 设定字、画、表格等的摆放位置
<NOBR> ● 不折行 令文字不因太长而绕行
<WBR> ● 建议折行 预设折行部位
字体标记
<STRONG> ● 加重语气 产生字体加粗 Bold 的效果
<B> ● 粗体标记 产生字体加粗的效果
<EM> ● 强调标记 字体出现斜体效果
<I> ● 斜体标记 字体出现斜体效果
<TT> ● 打字字体 Courier字体,字母宽度相同
<U> ● 加上底线 加上底线 反对
<H1> ● 一级标题标记 变粗变大加宽,程度与级数反比
<H2> ● 二级标题标记 将字体变粗变大加宽
<H3> ● 三级标题标记 将字体变粗变大加宽
<H4> ● 四级标题标记 将字体变粗变大加宽
<H5> ● 五级标题标记 将字体变粗变大加宽
<H6> ● 六级标题标记 将字体变粗变大加宽
<FONT> ● 字形标记 设定字形、大小、颜色 反对
<BASEFONT> ○ 基准字形标记 设定所有字形、大小、颜色 反对
<BIG> ● 字体加大 令字体稍为加大
<SMALL> ● 字体缩细 令字体稍为缩细
<STRIKE> ● 画线删除 为字体加一删除线 反对
<CODE> ● 程式码 字体稍为加宽如<TT>
<KBD> ● 键盘字 字体稍为加宽,单一空白
<SAMP> ● 范例 字体稍为加宽如<TT>
<VAR> ● 变数 斜体效果
<CITE> ● 传记引述 斜体效果
<BLOCKQUOTE> ● 引述文字区块 缩排字体
<DFN> ● 述语定义 斜体效果
<ADDRESS> ● 地址标记 斜体效果
<SUB> ● 下标字 下标字
<SUP> ● 上标字 指数(平方、立方等)
清单标记
<OL> ● 顺序清单 清单项目将以数字、字母顺序排列
<UL> ● 无序清单 清单项目将以圆点排列
<LI> ○ 清单项目 每一标记标示一项清单项目
<MENU> ● 选单清单 清单项目将以圆点排列,如<UL> 反对
<DIR> ● 目录清单 清单项目将以圆点排列,如<UL> 反对
<DL> ● 定义清单 清单分两层出现
<DT> ○ 定义条目 标示该项定义的标题
<DD> ○ 定义内容 标示定义内容
表格标记
<TABLE> ● 表格标记 设定该表格的各项参数
<CAPTION> ● 表格标题 做成一打通列以填入表格标题
<TR> ● 表格列 设定该表格的列
<TD> ● 表格栏 设定该表格的栏
<TH> ● 表格标头 相等于<TD>,但其内之字体会变粗
表单标记
<FORM> ● 表单标记 决定单一表单的运作模式
<TEXTAREA> ● 文字区块 提供文字方盒以输入较大量文字
<INPUT> ○ 输入标记 决定输入形式
<SELECT> ● 选择标记 建立 pop-up 卷动清单
<OPTION> ○ 选项 每一标记标示一个选项
图形标记
<IMG> ○ 图形标记 用以插入图形及设定图形属性
连结标记
<A> ● 连结标记 加入连结
<BASE> ○ 基准标记 可将相对 URL 转绝对及指定连结目标
框架标记
<FRAMESET> ● 框架设定 设定框架
<FRAME> ○ 框窗设定 设定框窗
<IFRAME> ○ 页内框架 于网页中间插入框架 IE
<NOFRAMES> ● 不支援框架 设定当浏览器不支援框架时的提示
影像地图
<MAP> ● 影像地图名称 设定影像地图名称
<AREA> ○ 连结区域 设定各连结区域
多媒体
<BGSOUND> ○ 背景声音 于背景播放声音或音乐 IE
<EMBED> ○ 多媒体 加入声音、音乐或影像
其他标记
<MARQUEE> ● 走动文字 令文字左右走动 IE
<BLINK> ● 闪烁文字 闪烁文字 NC
<ISINDEX> ○ 页内寻找器 可输入关键字寻找于该一页 反对
<META> ○ 开头定义 让浏览器知道这是 HTML 文件
<LINK> ○ 关系定义 定义该文件与其他 URL 的关系
StyleSheet
<STYLE> ● 样式表 控制网页版面
<span> ● 自订标记 独立使用或与样式表同用

注:

● 表示该标记属围堵标记,即需要关闭标记如 </标记>。
○ 表示该标记属空标记,即不需要关闭标记。
IE 表示该标记只适用于 Internet Explorer。
NC 表示该标记只适用于 Netscape Communicator。
反对 表示该标记不为 W3C 所赞同,通常这标记是 IE 或 NC 自订,且己为众所支 持,只是 HTML 标准中有其它同功能或更好的选择。
弃用 表示该标记己为 W3C 所弃用,是过时的标记,但 HTML 具向下兼容的特 性,不用担心新浏览器不支援旧标记。
新 表示该标记是 HTML 4.0 中新增的。

⑸ web前端怎么设置字体

<h1
style="
font-family:"微软雅黑";font-size:20px;color:red;
">标题的字体设置</h1>
上面用的内联样式设置了
文字内容的字体类型是:“微软雅黑”,字体大小20像素,颜色为红色。

⑹ web font怎么使用中文网页字体

1、在Web编码中,CSS默认应用的Web字体是有限的,虽然在新版本的CSS3,我们可以通过新增的@font-face属性来引入特殊的浏览器加载字体。
浏览器中展示网页文字内容时,文字字体都会按照设计师在css中定义的字体族的顺序来进行显示。什么是字体族?字体族就是你在css代码中看到“font-family”的代码内的一类字体名称,例如下面这行代码:
font-family:"Comic Sans MS","幼圆","黑体",sans-serif;

按照W3C标准,浏览器在解析一行代码时首先会在系统中查找Comic Sans MS字体,如果系统内存在这个字体那么浏览器就会使用Comic Sans MS字体,如果没有的话就接着查找幼圆字体,以此类推直到浏览器可以表达系统存在的字体为止。
注意了,“sans-serif”不是某个字体的名称,而是一种在前面叙述的字体都无效时而最终选用的字体,称为浏览器通用字体,它取决于你所用的浏览器默认的通用字体是什么,可能是“Arial”,也有可能是“Helvetica”。
2、网页常用字体通常分为5类:serif(衬线)、sans-serif(无衬线)、monospace(等宽)、fantasy(梦幻)、cuisive(草体),这些通用的名称允许用户代理从相应集合中选择一款字体。
serif 字体在字符笔画末端有叫做衬线的小细节,这些细节在大写字母中特别明显。
sans-serif 字体在字符笔画末端没有任何细节,与serif字体相比,他们的外形更简单。
monospace 字体,每个字母的宽度相等,通常用于计算机相关书籍中排版代码块。
fantasy 和 cuisive 字体在浏览器中不常用,在各个浏览器中有明显的差异。
3、网页常用字体
Sans-serif:
Helvetica: 被评为设计师最爱的字体,Realist风格,简洁现代的线条,非常受到追捧。在Mac下面被认为是最佳的网页字体,在Windows下由于Hinting的原因显示很糟糕。
Arial: Helvetica的“克隆”,和Helvetica非常像,细节上比如R和G有小小差别。如果字号太小,文字太多,看起来会有些累眼。Win和Mac显示都正常
Lucida Family: Lucida Grande是Mac OS UI的标准字体,属于humanist风格,稍微活泼一点。Mac下的显示要比Win下好。
Verdana: 专门为了屏显而设计的字体,humanist风格,在小字号下仍可以清楚显示,但是字体细节缺失严重,最好别做标题。
Tahoma: 也是humanist风格,字体和Verdana有点像,但是略窄一些,counter略小,曾经是Windows的标准字体,Mac 10.5之后默认也有安装。
Trebuchet MS: 为微软设计的一个humanist风格字体,个人觉得个性太过突出,用得不好会不搭。
Serif:
Georgia: 基本上适合正文屏显的衬线字体,非Georgia莫属了。笔画粗重,衬线明线,轮廓较大,小字体显示也很清晰,同时细节还算OK。
Times: Times是为了报纸而设计的,特点是可以在有限的空间塞进去更多的文字,笔画较弱,小字号正文屏显看起来累眼。曾经Engadget改版的时候用了Times作为正文,被骂得很惨之后换成了Georgia。
中文:
宋体:Win最常见的字体,小字体点阵,大字体TrueType,但是大字体并不好看,所以最好别做标题。
微软雅黑:Vista之后新引入的字体,打开Cleartype之后显示效果不错,不开Cleartype发虚。
华文细黑:Mac下的默认中文。
4、写个小demo,在各种浏览上测试了一下,各种浏览器对这个字体的解析还是有差异的。

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>font</title>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<meta name="author" content="@my_programmer">
<style type="text/css">
/*重置{*/
*{ padding:0;margin:0;} img{border:0;} li{list-style:none;}
/*}重置*/
div{font-size:1.2em;}
</style>
</head>
<body>
<br/>
--网页字体通常分为5类--
<div style="font-family: sans-serif;">你好 hello world sans-serif(无衬线) </div>
<div style="font-family: serif;">你好 hello world serif(衬线) </div>
<div style="font-family: monospace;">你好 hello world monospace(等宽) </div>
<div style="font-family: fantasy;">你好 hello world fantasy(梦幻) </div>
<div style="font-family: cuisive;">你好 hello world cuisive(草体) </div>
<br/>
--无衬线类--
<div style="font-family: Helvetica, sans-serif;">你好 hello world Helvetica </div>
<div style="font-family: Arial, sans-serif;">你好 hello world Arial </div>
<div style="font-family: 'Lucida Grande', sans-serif;">你好 hello world Lucida Grande </div>
<div style="font-family: Verdana,sans-serif;">你好 hello world Verdana </div>
<div style="font-family: Tahoma, sans-serif;">你好 hello world Tahoma </div>
<div style="font-family: 'Trebuchet MS', sans-serif;">你好 hello world Trebuchet MS </div>
<br/>
--衬线类--
<div style="font-family: Georgia, serif;">你好 hello world Georgia </div>
<div style="font-family: Times, serif;">你好 hello world Times </div>
<br/>
--中文字体--
<div style="font-family: 宋体">你好 hello world 宋体 </div>
<div style="font-family: 微软雅黑">你好 hello world 微软雅黑 </div>
<div style="font-family: 华文细黑">你好 hello world 华文细黑 </div>
<div style="font-family: 黑体">你好 hello world 黑体 </div>

</body>
</html>

⑺ 如何定义标题最恰当 符合Web标准

文档标题是文档的最主要的组成部分,也是搜索引擎蜘蛛爬行时最关注的内容,该如何定义标题呢?要回答这个问题,先设想我们要在一个页面上定义文章的标题,通常我们有三个方法来实现这个简单目的: A、没有语义的标题定义: <span class="heading">文章标题</span> 虽然在某些情况下<span>会是一个方便的标签,但它并不能表达出标题的完整含义。采用这个方法的一个好处是,我们可以对它附加一个CSS规则,使其文字象标题一样显示。 .heading { font-size: 24px; font-weight: bold; color: red; } 现在所有的标题都用heading class标记成了大号的粗体字体,并且为红色。但是这样做对吗?如果有人用一个不支持CSS的浏览器来观看,会是什么样的状况呢? 尽管class="heading"为这个标签增加了一点意义,但<span>仍然只是一个普通的标签,可以被大多数浏览器的缺省样式所修改掉。 搜索引擎检索这个页面时会略过<span>标签,就好象它不存在一样,不会对其可能包含的关键字给于一点额外的重视。在后面我们会更多的谈到搜索引擎和标题的关系。 最后,由于<span>标签是一个内嵌元素,我们可能需要把它嵌套在一个额外的块级元素中,比如<p>标签或<div>标签,为的是使它能够形成单独的行,这会进一步被非必要的代码弄乱你的标签。而这些额外增加的标签却是必须的,这样才能使不支持CSS的浏览器显示出没有差别的文本。 B、无助的<p>和<b>组合 <p><b>文章标题</b></p> 使用一个段落标签,将会给我们带来块级的显示,<b>会把文本变成粗体。但是用这个方法标记一个重要的标题时,我们面对的是同样无意义的结果。 不象方法A,<b>标签能在可视化的浏览器中把文字显示成粗体——甚至在不支持CSS的浏览器中。但是和<span>标签一样,搜索引擎也不会因为有一些东西在段落中被加粗了而给予更高的优先。 难以设计样式 用普通的<p>和<b>的组合,也带来了另一个缺憾——无法把这个标题设计成不同于其他段落的样式。我们可能想用一个特别的样式来突出标题,来使页面内容更清晰更具结构,但是用这个方法只能使其显示成粗体。 C、样式加实质 <h1>文章标题</h1> 恩,多么好的标题定义。大多数的网页设计者对它都很熟悉。其实适当的使用它们,<Hn> 就能为页面内容提供灵活的、可索引的、以及可样式化的结构。 这也是聪明的定义方法,你会发现它很简单。不再需要额外的标签,你可以说,这仅仅比另外两个方法节省了一点点的字节,可以忽略不计,但节省一点是一点。 <h1>一直到<h6>,代表了标题的六个级别,从最重要的(<h1>)到最次要的(<h6>)。他们本身就是块级的,不需要增加其它元素来使其单独成行。简单,有效——就是好工具。 为标题轻松定制样式 因为我们使用<h1>标签是唯一的,而<b>或<p>标签更适合使用在整个页面,所以我们可以用各种各样的CSS方法来样式化。 更重要的是,尽管完全不用样式,一个标题标签也能明显的表示出一个标题!可视化的浏览器把 <h1>显示成更大的粗体。一个非样式化的页面将以被期望的那样显示文档结构,用适当的标题标签来传达意思。 屏幕阅读器、PDA、手机、以及可视化的和非可视化的浏览器都会明白,碰到一个标题标签时该做的事情,正确的处理,比页面上的普通文本更重视的来对待。而使用<span>标签,那些不支持CSS的浏览器就不会特别的对待它。 讨厌的默认样式 以往,由于浏览器默认的缺省值非常的丑陋,设计者们也许会避免完全的使用标题标签。或者,因为缺省值的巨大尺寸而避免使用<h1>或<h2>,取而代之的是用更高数值的标题标签来实现更小的尺寸。 然而,需要重点强调的是,我们可以很简单的用CSS来改变这些标题标签——举个例子,一个<;h1>并非一定是占满大半屏幕的巨大标版。在后面,我将证明用CSS来样式化标题标签是多么的简单,希望可以帮助你减轻巨大的恐惧。 对搜索引擎的友好 这是一个巨大的好处。搜索引擎喜欢标题标签。另一方面,一个<span>标签或者普通的加粗的段落标签却在意味着次要一点。适当的用<h1>到<h6>标记你的标题,只需要你的一点点努力,然而却让搜索引擎更容易的检索到你的页面,让人们最终能找到它们。 搜索引擎机器人会给予标题标签特别的关注——这是你可能放置一些关键词的地方。就象检索到 <title>和<meta>,它们会顺着标题标签往页面下面查找。如果你不使用这些标签,那么包含在里面的关键词将不会被认为是有价值的,从而被忽略掉。 所以只要付出一点点的努力,你就能增加人们基于页面的内容找到你的站点的可能性。听上去不错,不是吗? 关于标题的次序 在范例中,这个特别的标题是页面中最重要的,因为它是文档的标题。因此,我们使用最重要的标题标签,<h1>。顺应W3C的规范,一些人认为跳过数个标题级是个不好的使用。举个例子,想象我们在下面的页面: <h1>文章标题</h1> 我们接下去的标题(如果不是用另一个<h1>重复的话)应该是<h2>,然后是<h3 >,等等。你也许不应该在<h1>后面跳过一级,直接跟上<h3>。我倾向于同意以上的观点,顺着行文保持级别的连续性,来构造一个排版结构。这样的话,给一个已经存在的页面添加标题和样式就更容易了,你会减少因使用超出的数字而导致的错误。 前面提到的,设计者也许会用<h4>来标签一个页面上最重要的标题,仅仅是因为它的缺省的字体尺寸不象<h1>那样令人生厌的巨大。但是记住,先结构,后设计。我们总是能用CSS来把标题样式化成任何我们喜欢的文字尺寸。 简单的样式 使用CSS,最容易做的事情就是给我们的标题设置不同的字体样式。我们可以建立一个CSS规则,它将把样式应用到页面中出现的所有<h1>标签(或者是整个站点,当使用一个外部样式表的时候)。随后,如果我们想要改变整个站点上所有出现<h1>标签的地方的颜色、尺寸、字体的话,我们所有需要做的事情就是修改一些CSS规则,然后它们将立即改变。听上去非常诱惑人,不是吗?

记得采纳啊