`

JS操作CSS整理

 
阅读更多

逐步整理JS操作CSS,记忆力要提高

 

   //var rightBox =document.getElementById("rightBox");
   //rightBox.style.backgroundImage="url(../images/01.jpg)";
  // rightBox.className=".box2";
 
  //document.getElementById( "rightBox" ).style.backgroundColor = "red";
 
  document.getElementById( "rightBox" ).style.backgroundImage="url(../images/rbj2.jpg)";

 

 

 

漂亮的css table

 

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"utf-8" />
<title>坏狼安全网-漂亮CSS Tables</title>
</head>
<style type="text/css">
/* CSS Document */

body {
font: normal 11px auto "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
color: #4f6b72;
background: #E6EAE9;
}

a {
color: #c75f3e;
}

#mytable {
width: 700px;
padding: 0;
margin: 0;
}

caption {
padding: 0 0 5px 0;
width: 700px;
font: italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
text-align: right;
}

th {
font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
color: #4f6b72;
border-right: 1px solid #C1DAD7;
border-bottom: 1px solid #C1DAD7;
border-top: 1px solid #C1DAD7;
letter-spacing: 2px;
text-transform: uppercase;
text-align: left;
padding: 6px 6px 6px 12px;
background: #CAE8EA  no-repeat;
}
/*power by www.winshell.cn*/
th.nobg {
border-top: 0;
border-left: 0;
border-right: 1px solid #C1DAD7;
background: none;
}

td {
border-right: 1px solid #C1DAD7;
border-bottom: 1px solid #C1DAD7;
background: #fff;
font-size:11px;
padding: 6px 6px 6px 12px;
color: #4f6b72;
}
/*power by www.winshell.cn*/

td.alt {
background: #F5FAFA;
color: #797268;
}

th.spec {
border-left: 1px solid #C1DAD7;
border-top: 0;
background: #fff no-repeat;
font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}

th.specalt {
border-left: 1px solid #C1DAD7;
border-top: 0;
background: #f5fafa no-repeat;
font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
color: #797268;
}
/*---------for IE 5.x bug*/
html>body td{ font-size:11px;}
body,td,th {
font-family: 宋体, Arial;
font-size: 12px;
}
</style>
<body>
<table id="mytable" cellspacing="0" summary="The technical specifications of the Apple

PowerMac G5 series">
<caption> </caption>
<tr>
<th scope="col">姓名</th>
<th scope="col">年龄</th>
<th scope="col">电话</th>
<th scope="col">居住地点</th>
</tr>
<tr>
<td class="row">badwolf</td>
<td class="row">100</td>
<td class="row">010-110</td>
<td class="row">中国北京</td>
</tr>
</table>

</body>
</html>

 

分享到:
评论

相关推荐

    HTML+CSS+JAVAscript详细手册(包含9个chm文档)

    (www.liwuguo.com 谢谢赞助整理)本人整理的是Web标准的主要组成部分,初级读者也可以轻松上手。以上文档同样适合正在学习静态网页技术、并想进一步提高的读者,并可作为网页前台工作者的参考手册。

    js css面试题

    整理的Js,css面试题目,1. form中的input有哪些类型?各是做什么处理使用的? text radio checkbox file button image submit reset hidden submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了...

    原生javascript实现读写CSS样式的方法详解

    可能大家一说起操作css样式,很多人都会想到jQuery的css方法:$(selector).css(name) ,但是有思考过如何使用原生js来实现类似的功能么? 大家最熟悉的原生js操作样式的方法非DOM中的Style对象莫属了,但是这个方法...

    web前端常用操作整理(含JS/HTML/CSS等方面知识)

    web前端包括JS、HTML、CSS等等方面,本文整理了前端的常用操作,善用可提高工作效率,个人感觉还不错,喜欢的朋友可以参考下

    HTML、CSS、Javascript在Web开发中的作用?

    JavaScript,一种脚本语言,脚本代码无需编译,在浏览器或 JS 容器可以直接解释执行 页面中 HTML 定义结构 CSS 控制显示样式 JavaScript 给页面加入各种操作和交互动作 【Java面试题与答案】整理推荐 基础与语法 ...

    毕业设计-基于Html+css+js+java实现的思维导图的可视化学习系统源码+文档说明+界面截图

    毕业设计-基于Html+css+js+java实现的思维导图的可视化学习系统源码+文档说明+界面截图 1.1 项目说明: “思维导图学习系统”是一款为了方便用户梳理知识的服务性软件,其中的服务端均在服务器后台部署、运行,并...

    JS学习资料

    在CSS彻底改变了Web页面布局的方式之后,万维网联盟跨浏览器的DOM标准的制定,使JavaScript终于突破瓶颈,成了大大改善网页用户体验的利器。 本书在简洁明快地讲述JavaScript和DOM的基本知识之后,过几个实例演示了...

    tastebile:日常代码归类整理总结学习

    fixed 的问题Javascript整理学习js知识,夯实基础 JavaScript编码规范 字符串的基本操作方法 JS获取URL中参数值(QueryString)的方法 对字符串中进行转义的 escapehtml 的函数 js基础之数组操作 数组的检测方法 ECM...

    jQuery使用手册(全).chm

    说明:本人用了一下午时间才整理出来的,好累,晚饭都没顾上吃,故此,下载分数提高,请见谅! jQuery是一款同prototype一样优秀js开发库类,特别是对css和XPath的支持,使我们写js变得更加方便!如果你不是个js高手...

    static-airbnb-redux

    以享受热重载剧本要启动本地Webpack Dev Server(通常在端口8080 ): yarn start 要整理src文件夹中的所有JavaScript文件,请执行以下操作: yarn lint 要将应用程序构建并部署到GitHub存储库上的gh-pages分支中,...

    前端面试宝典,收集整理了全网最新、最全面的面试资料,帮助各位求职面试者斩获理想Offer

    前端知识体系(HTML、CSS、JavaScript、流向框架、Nodejs、性能优化、前端工程化、错误监控、Web安全)、计算机网络(13大常考知识点,涉及到OSI七层参考模型中各层的功能和传输细节,以及跨域和缓存等前端常考知识...

    最新Python3.5零基础+高级+完整项目(28周全)培训视频学习资料

    javascript字符串操作以及跑马灯实例 javascript数组和字典以及for循环 javascript条件语句 javascript函数的定义 Dom直接选择器 Dom间接选择器 示例之模态对话框 示例之全选和反选以及取消 javascript必须加分号 ...

    40道Vue常见面试题,内含详细讲解

    本文以前端面试官的角度出发,对 Vue 框架中一些重要的特性、框架的原理以问题的形式进行整理汇总,意在帮助作者及读者自测下 Vue 掌握的程度。 本文章节结构以从易到难进行组织,建议读者按章节顺序进行阅读,当然...

    30道Vue常见面试题,内含详细讲解

    本文以前端面试官的角度出发,对 Vue 框架中一些重要的特性、框架的原理以问题的形式进行整理汇总,意在帮助作者及读者自测下 Vue 掌握的程度。 本文章节结构以从易到难进行组织,建议读者按章节顺序进行阅读,当然...

    基于Vs2013+SqlServer2008R2+Asp.net MVC等各种组件组成具有无限的扩展能力的综合信息服务管理平台

    1、支持多数据库,可在实体类指定具体操作数据库,可实现系统分库操作 2、重新整理架构,前端采用require.js进行模块化分离,缓存界面js/css等,后端全部采用异步模式async。最大化加快系统响应速度 3、编写系统配套的...

    jquery 常用操作整理 基础入门篇

    jQuery由美国人John Resig创建,至今... 它是轻量级的js库(压缩后只有21k) ,这是其它的js库所不及的,它兼容CSS3,还兼容各种浏览器 (IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+)。 jQuery是一个快速的,简洁的jav

    jQuery操作DOM_动力节点Java学院整理

    回顾一下修改DOM的CSS、文本、设置HTML有多么麻烦,而且有的浏览器只有innerHTML,有的浏览器支持innerText,有了jQuery对象,不需要考虑浏览器差异了,全部统一操作! 修改Text和HTML jQuery对象的text()和html()...

    MySQL学生成绩管理系统

    开发出一个操作简便、界面友好、灵活实用、安全可靠的学生成绩管理系统。...前端则借鉴了网上找到的前端页面模板,在此基础上修改,主要技术是html+css+js,前后端分离开发,使用postman等工具进行接口测试 。

    python入门到高级全栈工程师培训 第3期 附课件代码

    06 Python 今日内容整理 第13章 第13章共1课 第14章 01 数据类型和变量总结 02 集合定义和基本操作方法 03 集合关系运算交,差,并集 04 集合的其他内置方法 05 集合补充 06 百分号字符串拼接 07 format字符串...

    js使用小技巧

    整理收藏夹 onclick="window.external.ShowBrowserUI("OrganizeFavorites", null)"&gt; 语言设置 onclick="window.external.ShowBrowserUI("LanguageDialog", null)"&gt; 加入收藏夹 onclick="window.external....

Global site tag (gtag.js) - Google Analytics