• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >AngularJS > Javascript基础_标记文字的实现方法

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

作者: 字体:[增加 减小] 来源:互联网 时间:2017-05-30

本文主要包含javascript标记,javascript基础教程,javascript语言基础,javascript 基础,javascript基础入门等相关知识,希望在学习及工作中可以帮助到您

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>
</div>

对应元素习惯样式:

*一般表示关键词和产品名称*
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;}
</div>

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>
</div>

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>
</div>

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

</div>

您可能想查找下面的文章:

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

相关文章

  • 2017-05-30angular中使用路由和$location切换视图
  • 2017-05-30Angular 4.x 动态创建表单实例
  • 2017-05-30Angularjs整合微信UI(weui)
  • 2017-05-30Angular工具方法学习
  • 2017-05-30探索angularjs+requirejs全面实现按需加载的套路
  • 2017-05-30Angularjs之filter过滤器(推荐)
  • 2017-05-30AngularJS双向绑定和依赖反转实例详解
  • 2017-05-30AngularJS监听路由变化的方法
  • 2017-05-30如何在Angular2中使用jQuery及其插件的方法
  • 2017-05-30AngularJS入门教程之表格实例详解

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • AngularJS 使用ng-repeat报错 [ngRepeat:dupes]
    • 关于AngularJs数据的本地存储详解
    • AngularJs Creating Services详解及示例代码
    • AngularJS入门教程之AngularJS模型
    • AngularJS 路由和模板实例及路由地址简化方法(必看)
    • 如何使用AngularJs打造权限管理系统【简易型】
    • 利用Angularjs和原生JS分别实现动态效果的输入框
    • AngularJS 表达式详解及实例代码
    • angular route中使用resolve在uglify压缩后问题解决
    • AngularJS入门心得之directive和controller通信过程

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有