table border边框线虚线 隔行换色onmouse效果 div换色

最新推荐文章于 2024-08-07 02:17:51 发布
最新推荐文章于 2024-08-07 02:17:51 发布
阅读量7.6k 收藏 1
点赞数
文章标签： border table div function html 文档

<script type="text/javascript"> </script>

列1列2列3
112233
112233
112233
112233
11111111111111111111111112222222222222222222222222
aa

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
" http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<style type="text/css">
.a1{ background-color:#B3C1F4; color:#0E30AE}
.a2{ background-color:#EDF1FF; color:#0E30AE}
</style>
<script type="text/javascript">
<!--
function onloadEvent(func){
var one=window.onload
if(typeof window.onload!='function'){
window.οnlοad=func
}
else{
window.οnlοad=function(){
one();
func();
}
}
}
function showtable(){
var tablename=document.getElementById("table1")
var tr1=tablename.getElementsByTagName("tr")
for(var i=1 ;i<tr1.length;i++){
tr1[i].οnmοuseοver=function(){
this.style.fontWeight="bold";
this.style.backgroundColor="red";
}
tr1[i].οnmοuseοut=function(){
this.style.fontWeight=""
this.style.backgroundColor=""
}
if(i%2==0){
tr1[i].className="a1";
}else{
tr1[i].className="a2";
}
}
}
onloadEvent(showtable);
-->
</script>
<body>
<table width="100%" border="0" cellpadding="2" cellspacing="0">
 <tr>
  <td width="100%">
 
  <table border="0" cellpadding="3" cellspacing="1" width="100%" align="center" style="background-color: #b9d8f3;" id="table1">
   <tr style="text-align: center; COLOR: #0076C8; BACKGROUND-COLOR: #F4FAFF; font-weight: bold">
    <td><font size="2">列1</font></td>
    <td><font size="2">列2</font></td>
    <td><font size="2">列3</font></td>
   </tr>
       
   <tr bgcolor='#F4FAFF'>
    <td nowrap="nowrap" align="left">11<font size="2"></td>
    <td align="right"><font size="2">22</font></td>
    <td align="right"><font size="2">33</font></td>
   </tr>
    <tr bgcolor='#F4FAFF'>
    <td nowrap="nowrap" align="left">11<font size="2"></td>
    <td align="right"><font size="2">22</font></td>
    <td align="right"><font size="2">33</font></td>
   </tr>
   <tr bgcolor='#F4FAFF'>
    <td nowrap="nowrap" align="left">11<font size="2"></td>
    <td align="right"><font size="2">22</font></td>
    <td align="right"><font size="2">33</font></td>
   </tr>
   <tr bgcolor='#F4FAFF'>
    <td nowrap="nowrap" align="left">11<font size="2"></td>
    <td align="right"><font size="2">22</font></td>
    <td align="right"><font size="2">33</font></td>
   </tr>
  </table>

  </td>
 </tr>
</table>
<table border="0" cellspacing="1" width="100%">
     <tr>
           <td style="border: 1px dotted #000000">1111111111111111111111111</td>
           <td style="border: 1px dotted #000000">2222222222222222222222222</td>
     </tr>
</table>
<table style="border:dashed 1px #b22e2e">
 <tr><td>aa</td></tr>
</table>
<hr style="border:dashed 1px #b22e2e">
</body>
</html>

 

div换色

 

<html>
<head>
<style>
div{ star : expression(οnmοuseοver=function(){this.style.backgroundColor="#AAFFAA"; οnmοuseοut=function(){this.style.backgroundColor="#FFFFFF";}})}
</style>
</head>
<body>
<div>111</div>
<div>222</div>
<div>333</div>
</body>
</html>

brucelixn
关注
table虚线边框_边框样式的使用CSS入门基础（011）
weixin_42314399的博客
01-26 1240
今天我们说说边框样式的内容。在网页中，任何块元素和行内元素都可以设置边框属性。像div、img、table、span都可以设置边框属性的。设置边框一般有三个方面，一是边框的宽度，二是边框的外观，三是边框的颜色。语法：border-width:像素值；border-style:属性值；border-color：颜色值；边框的属性属性说明border-width边框的宽度border-sty...
table虚线边框_web前端工程师7天0基础到精通（TABLE+CSS制作《互联世纪网》）
weixin_39634194的博客
01-22 207
项目七 项目实践：TABLE+CSS制作《互联世纪网》实践目标1、 熟悉CSS属性2、 熟练运用CSS属性控制网页样式3、 熟悉网页制作流程项目简介：通过上一章节的学习，我们了解了CSS样式能更加方便、有效地控制网页结构和布局网页元素，大大提高网页的排版效率，也方便后期的管理和维护。接下来将通过互联世纪网的制作来体会和加强对同学对于CSS的理解和运用。在本项目中我们将运用TABLE+CSS对网页进...
Html_的table_边框设置
03-04
Html_的table_边框设置
js基础-批量生成标签 100个小方框
姗姗的博客
07-08 1958
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Co...
HTML中正确设置表格table边框border的三种办法
最新发布
weixin_37087311的博客
08-07 990
html中如果设置table的border为1px，实际会产生双线，十分不美观，那么在HTML中如何正确设置表格table边框border呢？第一种方法：　　1、将table的属性设置为：BORDER=0 、cellspacing=1 ；　　2、设置table的背景色为即你要设置的table的边框颜色；　　3、设置所有td...
css样式之border
weixin_30952535的博客
01-06 129
border用法详解： 1、border-width 属性设置边框的宽度 可能的值：像素 2、border-style 属性设置边框的样式 可能的值：solid(直线)，dashed(虚线)，dotted(点线) 2、border-color 属性设置边框的颜色 可能的值：red,#f00,#ff0000,rgb(255,0,0),transparent bo...
web学习笔记
刘群智的博客
07-27 1万+
常用属性............................................................................................ 1 Html基础........................................................................................... 3 ...
前端非框架类知识点汇总
weixin_46044936的博客
07-26 2484
html单词库 <link rel="stylesheet" href="css文件路径">css引入 <iframe src="danghang.html" width="100%" height="310px" frameborder="0"></iframe> 图片标签： img src="" title="" alt="" src属性 是指图像文件路径 alt属性 是在图片加载不出来时替换成文本 title属性 是在鼠标悬停的时候显示 srcset属性 是在不
小白IT:如何快速写出一个前端页面（网页），Python中如何使用前端语言什么是？JavaScript？BOM&DOM？Bootstrap？？
yidianyidei的博客
05-19 3957
JavaScript前端语言 1.什么是JavaScript语言 JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。用来给HTML页面增加动态功能 2.ECMAScript和JavaScript的关系 1996年11月，JavaScript的创造者–Netscape公司，将JavaScript提交给国际标准化组织ECMA。 次年，ECMA发布262号标准文件（ECMA-262）的第一版，规定了浏览器脚本语言的标准，并将这种语言称为ECMAScript，这个版本就是
iview学习帮助文档
weixin_40885337的博客
03-25 3346
安装iview npm install view-design --save 导入iview 在main.js中导入iview import ViewUI from 'view-design'; import 'view-design/dist/styles/iview.css'; Vue.use(ViewUI); 按需引用iview组件 a.安装babel npm install babel-plugin-import --save-dev b.在 .babelrc 文件中 { "plugins
css+js+jq实训笔记
weixin_42757570的博客
07-02 1380
css+js+jq实训笔记css第一天css第二天css第三天css第四天css第五天css第六天js第一天js第二天js第三天js第四天js第五天js第六天jq第一天jq第二天jq第三天 css第一天 1、平时有空多记单词（很多新单词） 2、用谷歌浏览器调试代码 3、多看看公众号和网站（对面试有很大的帮助，也可以帮助了解前端） 4、爱果果（可以去玩一下） 5、egret白鹭科技（游戏开发） 6、小程序API，要学会读懂文档、手册 7、学习PS 8、提高自己的审美 9、计算机网络、数据结构 考研408 10
html设置分割线虚线,css border设置虚线样式？
weixin_32348697的博客
06-09 8740
在网页布局中，有时为了整体网页的美观，我们需要设置不同的边框样式。那么怎么设置边框的虚线样式？本篇文章就给大家介绍css设置边框虚线样式的两种方式。有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。首先要知道在css中我们是使用border属性来设置边框的，它可以通过设置边框的宽度、颜色、圆角度、样式(实线、虚线、双线等等)。下面我们通过简单的代码示例来具体看看css的border边框...
表格边框虚线显示
抬头30°的微笑的专栏
07-31 1623
.table5{text-align:center; border:1px solid #cccccc; border-radius :3px; background-color:#FFFFFF; width:650px;} .table5 td{border-bottom:1px dashed #cccccc;} .table5 .last td{border-bottom:0;}
CSS作表格虚线
weixin_30449453的博客
05-10 254
#file.css #tb_app_list {border-collapse:collapse;border:dashed #6AA70B;border-width:0px 0 0 0px;width:96%;}td,th {border:solid #6AA70B;border:dashed #6AA70B;border-width:0 0px 1px 0;font-family: "...
table 边框线设置
a392266126的博客
12-05 1909
table{ border-collapse:collapse;border:none; } td{ border:solid #000 1px; }
Table边框使用总结
weixin_33738982的博客
05-13 364
一、表格的常用属性基本属性有：width（宽度）、height（高度）、border（边框值）、cellspacing（表格的内宽，即表格与tr之间的间隔）、 cellpadding（表格内元素的间隔，即tr与tr之间的间隔）、bordercolorlight（表格的亮边框颜色）、 bordercolordark（表格的暗边框颜色）、bgcolor（表格的背景色）、background（表格的背景...
css实现虚线表格样式
dxz_water的专栏
04-11 2074
我们在建立table的时候，会发现它会具有一些默认的样式，比如单元格td之间会有间距，所以我们通常开头是这样写的： 　　 创建表的时候，想实现网格虚线的表格样式，可选用css 写法如下： style="border:1px dashed #000;" style="border:1px dotted #000;" 显示的效果如图所示： 各边及全部：
border的属性及写法大全：实线、点线、虚线、双线、混合用法
热门推荐
最初都是小白
03-26 12万+
border的属性及写法： 属性 含义 solid 实线 dotted 点线 dashed 虚线 double 双线 单项写法及效果演示： （后面有完整代码） 1.实线 // 1. 实线：solid .border1{ border: 1px solid #666; } 实线效果： 2.点线 // 2. 点线：...
table如何设置边框
u011265702的博客
06-14 6221
转自：https://blog.csdn.net/glgom/article/details/83045291 后台写表格时： 1.前台的style=“border:thin”; 在后台是style=“border:thin;”; 2.border=“1” 边框设置为1，cellspacing=“0” 单元格间距设置为0. 3.border-collapse: collapse; /设置单元格的边...
JS实现表格隔行换色与排序技术解析
"JS实现隔行换色的表格排序，主要涉及JavaScript操作DOM元素、数据绑定、CSS样式以及表格排序的实现方法。" 在网页开发中，为了提高用户体验，经常会在表格中使用隔行换色的技术，使得用户更容易区分每一行的数据。...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值