改变网页中的浏览风格（字体大小和背景颜色）

最新推荐文章于 2021-07-05 17:30:23 发布

哈佛凌晨

最新推荐文章于 2021-07-05 17:30:23 发布

阅读量2.7k

点赞数 2

分类专栏：学习笔记 javascirpt 文章标签： class xhtml javascript function html div

本文链接：https://blog.csdn.net/dyushuo6230/article/details/7307852

版权

学习笔记同时被 2 个专栏收录

40 篇文章 0 订阅

订阅专栏

javascirpt

19 篇文章 1 订阅

订阅专栏

看到某某网站的新闻内容部分的字体大小和背景还可以该，这网站能适应好多人的脾气，呵呵，很不错的。下边将实现的方法给大家共享下。

效果图：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>改变网页中的浏览风格（字体大小和背景颜色）</title>
<style>
.k1{
height:10px;
width:10px;
border:1px #00F solid;
margin:2px;
float:right;
cursor:pointer;
}

</style>
<script language="javascript" type="text/javascript">
function changeColor(color){

//设置背景颜色
document.bgColor=color;

}
function changeSize(size){
//获取div对象
document.getElementById("content").style.fontSize=size+"px";

}
</script>
</head

><body>
<div class="k1" style="background-color:#66CCFF" οnclick="changeColor('#66ccff')"></div>
<div class="k1" style="background-color:#FCC" οnclick="changeColor('#fcccc')"></div>
<div class="k1" style="background-color:#FFC" οnclick="changeColor('#ffcccc')"></div>

<span οnclick="changeSize(26)">大</span>
<span οnclick="changeSize(16)">中</span>
<span οnclick="changeSize(10)">小</span>

<hr style="clear:both" />

<div id="content">关于英语四级包过秘籍<br />
三长一短，选短的；三短一长，选长的，长短不一要选B，参差不齐要选D,以蒙为主，以抄为辅，抄蒙结合，四级必过~

</div>
</body>
</html>

哈佛凌晨

关注

2
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
改变网页中的浏览风格（字体大小和背景颜色）

看到某某网站的新闻内容部分的字体大小和背景还可以该，这网站能适应好多人的脾气，呵呵，很不错的。下边将实现的方法给大家共享下。效果图：改变网页中的浏览风格（字体大小和背景颜色）.k1{ height:10px; width:10px; border:1px #00F solid; margin:2px; float:right; cur
复制链接

扫一扫