shit IE table border bug & border-collapse bug > `border-collapse: collapse;` table { width: 100%; border-collapse: collapse; border-spacing: 0; font-size: 13px; font-weight: normal; overflow: hidden; margin-bottom: 15px; color: #727272; } IE table…
border-collapse:collapse 用于表格属性, 表示表格的两边框合并为一条; <style type="text/css"> table { border-collapse:collapse; } table, td, th { border:1px solid black; } </style> <table> <tr> <th>Firstname</th> <th>Lastname…
table的CSS为{border-collapse:collapse;border:none;},再设置td的CSS为{border:solid#000 1px;}是一个非常不错的方法. 示例: <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html…
摘要:最近在做一个博客系统,其他需要用到博客日历控件,网上搜索了很多资料,其中大部分都是javascript的,经过总结使用jquery实现了博客日历效果.代码如下: 原文链接转载请注明:http://www.kwstu.com/ArticleView/admin_2013916154649951 一.效果图 二.页面文件 页面上需要添加<div id="cal"></div>标记. 三.JS代码 // JavaScript 日历 $(document).rea…
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>层级选择器</title> <link rel="stylesheet" href="../../css/style.css" /> <script type="text/javascript" src="..…
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>层级选择器</title> <link rel="stylesheet" href="../../css/style.css" type="text/css"/> <script type="text/java…
jQuery提供了用于扩展jQuery功能的方法,即jQuery.fn.extend()方法和jQuery.extend()方法. 基本的JS框架代码如下: ;(function($) { $.fn.extend({ //这里写插件代码 }); })(jQuery); 例子:编写一个表格隔行变色插件 JS代码 1. 插件编写 //插件编写 ;(function($) { $.fn.extend({ "alterBgColor":function(options){ //设置默认值 op…
1.初始: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>cellspacing的css实现</title> <style type="text/css"> table { border: 1px solid red; } td { border: 1px solid r…
LODOP中可以用ADD_PRINT_TABLE.ADD_PRINT_HTM.ADD_PRINT_HTML.ADD_PRINT_TBURL等可以输出超文本的表格,超文有超过打印项高度或纸张高度自动分页的特点,具体可查看本博客相关博文:LODOP中ADD_PRINT_TABLE.HTM.HTML表格自动分页测试如上博文,ADD_PRINT_HTM自动分页后,可以补线,第二页的表格上方可还存在表格线. 但是如果table标签不加border样式,所有border样式都加在td里,那么自动分页后就会出…
amazeui学习笔记--js插件(UI增强3)--折叠面板Collapse 一.总结 注意点: 1.data-am-collapse:这个东西就是展开折叠事件 2.am-collapse(包括其下属):这个控制折叠样式 1.折叠面板:结合 Panel 组件实现手风琴效果.需结合以下辅助 class 使用: 要隐藏的内容添加 .am-collapse: 默认显示的内容添加 .am-collapse.am-in: 添加以上 class 以后,通过 Data API 来调用: <h4 data-am…
实例 折叠(Collapse)插件可以很容易地让页面区域折叠起来.无论您用它来创建折叠导航还是内容面板,它都允许很多内容选项. .collapse 隐藏内容. .collapse.in 显示内容. .collapsing 当过渡效果开始时被添加,当过渡效果完成时被移除. <!DOCTYPE HTML><html><head><link href="/stylesheets/bootstrap.min.css" rel="stylesh…
今天做的项目,用到了bootstrap的折叠功能,这个功能需要只展开一个折叠框,点击一个就会自动隐藏另一个,初始按照API做了一下,发现一切运行正常,但是测试的同事提了一个bug,说切换到其他模块后再切换回来,发现原先展开的折叠框没有折叠起来--即恢复原样.于是又去修改代码,回来的时候对所有折叠框调用: .collapse('hide')方法. $(".love .collapse").collapse('hide'); 调用之后发现,点击连接苗,data-parent失效了,也就是可…
ylbtech-Bootstrap-Plugin:折叠(Collapse)插件 1.返回顶部 1. Bootstrap 折叠(Collapse)插件 折叠(Collapse)插件可以很容易地让页面区域折叠起来.无论您用它来创建折叠导航还是内容面板,它都允许很多内容选项. 如果您想要单独引用该插件的功能,那么您需要引用 collapse.js.同时,也需要在您的 Bootstrap 版本中引用 Transition(过渡)插件.或者,正如 Bootstrap 插件概览 一章中所提到,您可以引用 b…
/* ======================================================================== * Bootstrap: collapse.js v3.3.7 * http://getbootstrap.com/javascript/#collapse * ======================================================================== * Copyright 2011-201…
<html>    <head>        <meta charset="UTF-8">        <title>个人简历</title>    </head>    <body>        <h3 align="center">个人简历</h3>        <table border="1" cellspacing=…
官方文档 https://ant.design/components/collapse-cn/ 目录 一.antd中的collapse 代码目录 1.组件结构图(♦♦♦重要) 2.源码节选:antd/components/collapse/collapse.tsx 3.源码节选:antd/components/collapse/CollapsePanel.tsx 二.RcCollapse 代码目录 1.组件内部属性结构及方法调用关系图(♦♦♦重要) 2.组件应用的设计模式(♦♦♦重要) 3.源码…
一般来说,给表格加边框都会出现不同的问题,以下是给表格加边框后展现比较好的方式 <style> table,table tr th, table tr td { border:1px solid #0094ff; } table { width: 200px; min-height: 25px; line-height: 25px; text-align: center; border-collapse: collapse;} </style> <table> <…
table:设置边距,td内容过长用省略号代替 1.table:设置边距 合并表格边框border-collapse: collapse,然后用th,td的padding设置内容和边框之间的空隙padding. 2.td内容过长用省略号代替 在table中必须设置style:table-layout: fixed;这条属性就是让table的内部布局固定大小.这个时候就用width属性调节td的长度.之后在添加如下:td {white-space:nowrap;overflow:hidden;te…
<style> table th { white-space: nowrap; background-color: #f5f5f5; height:30px; font-size:14px; font-weight:lighter; /*细*/ text-align:right ! important } .chk { white-space: nowrap; text-overflow:ellipsis;/*省略*/ } table td { /*word-break:keep-all;*/…
<style> table th { white-space: nowrap; } .chk { white-space: nowrap; } </style> <table border="0" cellspacing="1" style="background-color: #a0c6e5; width: 100%"> <th> 编号: </th> <td> <in…
<style type="text/css"> /*所有内容都在这个DIV内*/ div.all { border: 3px solid #FF00FF; width: 80%; /*这个宽度可根据实际需要改变*/ clear: right; } /*表头在这个DIV内*/ div.title { width: 100%; } /*内容在这个DIV内*/ div.content { width: 100%; overflow: scroll; /*总是显示滚动条*/ ove…
js div顶部吸附示例,例如这样: 以下为DIV顶部吸附示例:(此示例来自于网络,在此记录与分享!感谢原作者!) 示例1:兼容IE6 <div style="height:300px;background:#e0e0e0"></div> <div id="fixedMenu" style="background:#ffffff;width:100%;"> <ul> <li><a…
HTML有10个表格相关标签 <caption> 表格的大标题,该标记可以出现在<table> 之间的任意位置.它对于搜索引擎的机器人记录信息十分重要.参数有align.valign <col> 表格的列定义属性 <colgroup> 定义表格列的分组,Firefox.Chrome 以及Safari 仅支持colgroup 元素的span 和width 属性 <table> 定义表格 <tbody> 定义表格主体 <td>…
1,设置表格边框为单线框 table, th, td { border: 1px solid blue; }加上:table { border-collapse:collapse; } 由于 table.th 以及 td 元素都有独立的边框,设置border会使表格具有双线条边框,如果需要把表格显示为单线条边框,请使用 border-collapse 属性.border-collapse:collapse; 说的是 边框折叠情况:折叠. 2,设置单元格td的宽度不起作用加上:table { ta…
虽然Table布局已经过时,偶尔还是会用到,简要实用代码,如下: <table border="1" cellpadding="0" cellspacing="0" style="text-align:center;border-collapse:collapse;"> <thead style="background-color:#B0C4DE;font-weight:bold;">…
<!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-…
实现table的单线边框的办法 现在给出效果图: 1.实现方法一:    <table border="0" cellspacing="1" style="background-color:#a0c6e5">    实现原理:利用table的单元格之间的间距(cellspacing)和table的背景色来实现 2.实现方法二:    <table border="1" bordercolor="#a…
<!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-Typ…
1.实现方法一:    <table border="0" cellspacing="1" style="    实现原理:利用table的单元格之间的间距(cellspacing)和table的背景色来实现 2.实现方法二:    <table border="1" bordercolor="#a0c6e5" style="border-collapse:collapse;">…
(1)用expression 鼠标滑过变色: <style type="text/css"><!-- table { background-color:#000000; cursor:hand; width:100%; }td { onmouseover: expression(onmouseover=function (){this.style.borderColor ='blue';this.style.color='red';this.style.backgro…