Javascript基础_标记文字的实现方法  更新时间:2016年06月14日 10:49:13   投稿:jingxian   下面小编就为大家带来一篇Javascript基础_标记文字的实现方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧 Javascript基础_标记文字的实现方法  1.用基本的文字元素标记内容 先看显示效果: 对应HTML代码: Learn4Font 元素 b —— I am the example. 元素 em —— I am the example. 元素 i —— I am the example. 元素 s —— I am the example. 元素 strong —— I am the example. 元素 u —— I am the example. 元素 small —— I am the example. 元素 sub —— I am the example. 元素 sup —— I am the example. 对应元素习惯样式: *一般表示关键词和产品名称* b{font-weight: bolder;} *一般表示加以强调* em {font-style: italic;} *一般表示外文词语或科技术语* i {font-style: italic;} *一般表示不准确或校正* s {text-decoration: line-through;} *一般表示重要文字* strong {font-weight: bolder;} *一般表示为文字添加下划线* u {text-decoration: underline;} *一般表示为添加小号字体内容* small {font-size: small;} *一般表示添加上标和下标* sup {vertical-align: sub; font-size: smaller;} sub {vertical-align: super; font-size:smaller;} 2.使用语言元素 ruby、rt 和 rp 元素,先看效果: 对应代码: 魑(chī) 魅(mèi) 魍(wǎng) 魉(liǎng) 3.使用预先编排好格式的内容 pre 元素可以改变浏览器处理内容的方式,阻止合并空白字符,让源文档中的格式得以保留。   var fruits = [“apples”,”oranges”,”mangoes”,”cherries”]; for(var i= 0; i < fruits.length; i++){ document.writeln("I like " + fruits[i]); } 以上这篇Javascript基础_标记文字的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。 您可能感兴趣的文章: 使用javascript过滤html的字符串(注释标记法) js自动闭合html标签(自动补全html标记) javascript 自动标记来自搜索结果页的关键字 javascript 标记 相关文章 Angularjs中的页面访问权限怎么设置 最近一直在忙一个手机端的项目,所以对js学习有点松撤了。今天小编抽时间跟大家分享一篇关于angularjs中的页面访问权限设置教处,对angularjs访问权限感兴趣的朋友一起学习吧 2016-11-11 浅谈ng-zorro使用心得 这篇文章主要介绍了浅谈ng-zorro使用心得,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧 2018-12-12 angularjs下拉框空白的解决办法 这篇文章主要为大家详细介绍了angularjs下拉框空白,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 2017-06-06 Angular4如何自定义首屏的加载动画详解 Angular应用程序在首次加载根组件时会在浏览器的显示一个loading…动画,下面这篇文章主要给大家介绍了关于Angular4如何自定义首屏加载动画的相关资料,文中通过示例代码介绍的非常详细,对大家具有一定的参考学习价值,需要的朋友们下面跟着小编来一起看看吧。 2017-07-07 angular多语言配置详解 这篇文章主要介绍了angular多语言配置详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧 2019-05-05 Angularjs中UI Router的使用方法 这篇文章主要为大家详细介绍了Angularjs中UI Router的使用方法,感兴趣的朋友可以参考一下 2016-05-05 AngularJS优雅的自定义指令 这篇文章主要介绍了AngularJS优雅的自定义指令,告诉大家为什么使用AngularJS自定义指令,以及如何使用AngularJS自定义指令?感兴趣的小伙伴们可以参考一下 2016-07-07 AngularJS实现在ng-Options加上index的解决方法 这篇文章主要介绍了AngularJS实现在ng-Options加上index的解决方法,结合实例形式分析了AngularJS在ngOptions添加索引的操作步骤与相关实现技巧,需要的朋友可以参考下 2016-11-11 Angular 2父子组件之间共享服务通信的实现 这篇文章主要给大家介绍了关于Angular 2父子组件之间共享服务通信的相关资料,文中通过示例代码介绍的非常详细,对大家具有一定的参考学习价值,需要的朋友们下面来一起看看吧。 2017-07-07 使用Raygun来自动追踪AngularJS中的异常 这篇文章主要介绍了使用Raygun来自动追踪AngularJS中的异常,AngularJS是一款高人气的JavaScript库,需要的朋友可以参考下 2015-06-06 最新评论

Javascript基础_标记文字的实现方法

 1.用基本的文字元素标记内容

先看显示效果:

对应HTML代码:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Learn4Font</title>
</head>
<body>
<p> 元素 b —— <b> I am the example.</b></p>
<p> 元素 em —— <em> I am the example.</em></p>
<p> 元素 i —— <i> I am the example.</i></p>
<p> 元素 s —— <s> I am the example.</s></p>
<p> 元素 strong —— <strong> I am the example.</strong></p>
<p> 元素 u —— <u> I am the example.</u></p>
<p> 元素 small —— <small> I am the example.</small></p>
<p> 元素 sub —— <sub> I am the example.</sub></p>
<p> 元素 sup —— <sup> I am the example.</sup></p>
</body>
</html>

对应元素习惯样式:

*一般表示关键词和产品名称*
b{font-weight: bolder;}

*一般表示加以强调*
em {font-style: italic;}

*一般表示外文词语或科技术语*
i {font-style: italic;}

*一般表示不准确或校正*
s {text-decoration: line-through;}

*一般表示重要文字*
strong {font-weight: bolder;}

*一般表示为文字添加下划线*
u {text-decoration: underline;}

*一般表示为添加小号字体内容*
small {font-size: small;}

*一般表示添加上标和下标*
sup {vertical-align: sub; font-size: smaller;}
sub {vertical-align: super; font-size:smaller;}

2.使用语言元素

ruby、rt 和 rp 元素,先看效果:

对应代码:

<p style=" font-size: 3em;">
  <ruby>魑<rp>(</rp><rt>chī</rt><rp>)</rp></ruby>
  <ruby>魅<rp>(</rp><rt>mèi</rt><rp>)</rp></ruby>
  <ruby>魍<rp>(</rp><rt>wǎng</rt><rp>)</rp></ruby>
  <ruby>魉<rp>(</rp><rt>liǎng</rt><rp>)</rp></ruby>
</p>

3.使用预先编排好格式的内容

pre 元素可以改变浏览器处理内容的方式,阻止合并空白字符,让源文档中的格式得以保留。

 

<pre>
  <code>
    var fruits = ["apples","oranges","mangoes","cherries"];
    for(var i= 0; i < fruits.length; i++){
      document.writeln("I like " + fruits[i]);
    }
  </code>
</pre>

以上这篇Javascript基础_标记文字的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

您可能感兴趣的文章:

  • 使用javascript过滤html的字符串(注释标记法)
  • js自动闭合html标签(自动补全html标记)
  • javascript 自动标记来自搜索结果页的关键字
张贴在3