随笔分类 - html/css

DIV内容垂直居中

摘要：css垂直居中属性设置vertical-align: middle对div不起作用，例如：运行后按钮没有在DIV中垂直居中：解决思路：如果div和按钮的宽高都确定为具体像素值，可以直接设定按钮的css属性：position：relative; top为(div.height - button.h 阅读全文

posted @ 2016-03-27 23:29 MySomeDay 阅读(1363) 评论(2) 推荐(0) 编辑

在HTML中实现和使用遮罩层

摘要：Web页面中使用遮罩层，可防止重复操作，提示loading；也可以模拟弹出模态窗口。实现思路：一个DIV作为遮罩层，一个DIV显示loading动态GIF图片。在下面的示例代码中，同时展示了如何在iframe子页面中调用显示和隐藏遮罩层。完整示例代码打包下载示例代码： index.html c 阅读全文

posted @ 2016-03-25 01:38 MySomeDay 阅读(39137) 评论(0) 推荐(2) 编辑

基于CSS属性display:table的表格布局的使用

摘要：项目改造中遇到DIV+CSS实现的table，新需求需要在表格使用单元格合并，网上调查返现CSS display:table实现的table表格，没有单元格的属性和样式，经过一番思考，曲折现实了单元格的合并，即采用正行嵌套一个单独的display:table的DIV，然后在嵌套的表格DIV内部通过控阅读全文

posted @ 2016-03-23 02:36 MySomeDay 阅读(41377) 评论(2) 推荐(4) 编辑

html文件上传控件file自定义样式

摘要：问题： HTML自带的file上传按钮因在各种浏览器里显示样式不一、不易自定义样式给我们带来很大的麻烦。解决思路：将input[type=file]控件隐藏，使用一个input[type=text]和button组合作为file控件的替代（样式自行定义），并将隐藏的file控件和作为替代的tex 阅读全文

posted @ 2016-01-30 16:33 MySomeDay 阅读(1614) 评论(0) 推荐(0) 编辑

input文本框只能输入数字

摘要：HTML中的input文本框有时候需要数字的做输入检查，如果能做输入之前限定只能输入数字的话，就可以省去在提交时候的输入内容检查了。下面是自己在火狐浏览器上调试出的实现，实现原理就是在键盘事件（onkeydown，onkeyup）和粘贴事件（onpaste）中做处理：阅读全文

posted @ 2016-01-28 23:01 MySomeDay 阅读(938) 评论(0) 推荐(0) 编辑

CSS实现超出DIV宽度文字自动隐藏并显示省略号

摘要：当文字超出DIV宽度时，超出的文字部分省略，并用显示省略号代替，css代码如下：重要前提是DIV为固定宽度。 <end> 阅读全文

posted @ 2016-01-26 10:51 MySomeDay 阅读(4626) 评论(0) 推荐(0) 编辑