<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <base href="<%=basePath%>">

    <title>My JSP 'index.jsp' starting page</title>

	<meta http-equiv="pragma" content="no-cache">

	<meta http-equiv="cache-control" content="no-cache">

	<meta http-equiv="expires" content="0">

	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

	<meta http-equiv="description" content="This is my page">

	<!--

	<link rel="stylesheet" type="text/css" href="styles.css">

	-->

	<script type="text/javascript">

		function changeStyle(style){

			alert(style);

			var divNode = document.getElementById("newsid");

			divNode.className = style;

		}

	</script>

	<style type="text/css">

		.fontBig{

			color: #0000CC;

			font-size:24px;

			font-family: serif;

		}

		.fontMedi{

			color: #FF0000;

			font-size: 16px;

			font-family: sans-serif;

		}

		.fontSmall{

			color: yellow;

			font-size: 4px;

			font-family: inherit;

		}

	</style>

  </head>

  <body>

  	<H2>新闻标题</H2>  <br/>

  	<a href="javascript:void(0)" onclick="changeStyle('fontBig')">大字体</a>  ||

  	<a href="javascript:void(0)" onclick="changeStyle('fontMedi')">中字体</a>  ||

  	<a href="javascript:void(0)" onclick="changeStyle('fontSmall')">小字体</a>  <br/>

  	<div id="newsid" >

  		新闻新闻新闻新闻新闻<br/>新闻新闻新闻新闻新闻

  	</div>

  	<input type="button" onclick="demo()" value="点点">

  </body>

</html>

　　

JS完成改变新闻字体大中小的显示的更多相关文章

  1. 《项目经验》--后台一般处理程序向前台JS文件传递JSON，JS解析JSON,将数据显示在界面--显示在DropDownList 或 显示在动态创建的table中

    http://blog.csdn.net/mazhaojuan/article/details/8599167 先看一下我要实现的功能界面: 这篇文章主要介绍:后台一般处理程序把从数据库查找的数据,转 ...

  2. js基础--浏览器标签页隐藏或显示状态 visibility详解

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 前言 在工作中我们可能会遇到这样的需求,当浏览器切换到别的标签页或着最小化时,我们需要暂停页面上正在播放的视频或者音乐,这个需求 ...

  3. BootStrap字体图标不显示、下拉菜单不显示

    在W3CSchool学习BootStrap教程时遇到的问题…… 1.字体图标不能显示 上面是正常显示的样子,不能正常显示,因为缺少下面的字体图标样式文件 (1)在下载的Bootstrap包中将font ...

  4. Android代码中设置字体大小，字体颜色，显示两种颜色.倒计时效果

    Android代码中设置字体大小,字体颜色,显示两种颜色 在xml文件中字体大小用的像素 <TextView android:id="@+id/uppaid_time" an ...

  5. vue iView 打包后 字体图标不显示

    问题描述: 今天webpack打包后发现iView 字体图标不显示 解决方案: build/webpack.prod.conf.js 这个文件里面 module: { rules: utils.sty ...

  6. webpack打包绝对路径引用资源和element ui字体图标不显示的解决办法

    webpack打包绝对路径引用资源解决办法: 打开webpack.prod.conf.js 找到output:增加 publicPath: './',  即可,如图  element ui字体图标不显 ...

  7. linux终端c语言改变输出字体颜色

    Linux下C改变输出字体颜色 例: #include int main() { printf("\033[31mThis is RED.\n\033[0m"); return 0 ...

  8. js控制 固定框架内图片 按比例显示 以及 占满框架 居中显示

    js控制 固定框架内图片 等比例显示 以及 占满框架 纵横居中显示 通过设置 js函数 fitDiv里面var fit的值就好 function fitDiv (obj) { var target_w ...

  9. atitit js 开发工具 ide的代码结构显示(func list) outline总结

    atitit js 开发工具 ide的代码结构显示(func list) outline总结 eclips环境::4.3.1 #-------需要一个js开发工具,可以显示outline或者代码结构显 ...

随机推荐

  1. linux mmap 内存映射【转】

    转自:http://blog.csdn.net/xyyangkun/article/details/7830313 [-] mmap vs readwritelseek mmap vs malloc ...

  2. Jython安装步骤

    1.下载安装包 2.执行安装 Java -jar [此处是下载的jython jar包名],或者双击jar包夜可以 3.配置环境变量 新增JYTHON_THOME的环境变量,并设置为安装路径. 配置c ...

  3. 利用OpenStack Rest API 创建镜像

    服务端点: image API: POST     /v2/images Request1:     Method:Post     Url: http://192.168.31.147:9292/v ...

  4. SQL编程之高级查询（子查询）以及注意事项

    SQL编程之高级查询(子查询)以及注意事项   1.什么是子查询? 当一个查询是另一个查询的条件时,称之为子查询.子查询可以使用几个简单命令构造功能强大的复合命令.子查询最常用于SELECT-SQL命 ...

  5. WMsg参数常量值

    //WMsg参数常量值: //创建一个窗口 const int WM_CREATE = 0x01; //当一个窗口被破坏时发送 const int WM_DESTROY = 0x02; //移动一个窗 ...

  6. [ios][swift]使用swift闭包进行viewcontroller反向传值

    闭包参考:http://c.biancheng.net/cpp/html/2285.html   闭包详解 传值参考:http://www.tuicool.com/articles/vy2uUz Sw ...

  7. 周赛-Clique in the Divisibility Graph 分类： 比赛 2015-08-02 09:02 23人阅读 评论(3) 收藏

    Clique in the Divisibility Graph time limit per test1 second memory limit per test256 megabytes inpu ...

  8. EasyUI DataGrid 添加排序

    这个事例演示了如何在点击列头的时候排序DataGrid中全部的列可以通过点击列头被排序.你可以定义可以被排序的列.默认的,列不能被排序除非你设置sortable属性为TRUE,下面是例子:标记 < ...

  9. PM（Project Manager）：系列博客

    http://blog.csdn.net/MoreeVan/article/list/2

  10. SqlSever基础 dateadd month 增加五个月

    镇场诗:---大梦谁觉,水月中建博客.百千磨难,才知世事无常.---今持佛语,技术无量愿学.愿尽所学,铸一良心博客.------------------------------------------ ...