CSS整理的答疑
2015-12-03 10:18
218 查看
1.position:relavie div元素,相对定位,如何居中
2.普通元素如何居中(加margin:0 auto)
<table border="1" style="margin:0 auto;">
</table>文字如何居中,(此时body中的文字都居中)
body{text-align:center;}
3.opacity: 0属性控制不透明级别,0是完全被覆盖,透明
4.<input type="file" />控件难看
结果如下图:
.jmx-file-box{ position: relative; width: 340px; left: 50%; margin-left: -170px; /*此处的负值是宽度的一半*/ } <div class="jmx-file-box"></div>
2.普通元素如何居中(加margin:0 auto)
<table border="1" style="margin:0 auto;">
</table>文字如何居中,(此时body中的文字都居中)
body{text-align:center;}
3.opacity: 0属性控制不透明级别,0是完全被覆盖,透明
.jmxfile{opacity: 0} <input type="file class="jmxfile" />
4.<input type="file" />控件难看
<style type="text/css"> /*jmx file 样式*/ input{vertical-align:middle; margin:0; padding:0} .jmx-file-box{position:relative;width:340px;left:50%;margin-left:-170px;}/*position:relative;*/ .txt{ height:22px; border:1px solid #cdcdcd; width:180px;} .btn{ background-color:#FFF; border:1px solid #CDCDCD;height:24px; width:70px;} .jmxfile{text-align:center; position:absolute;top:0;right:80px; height:24px; filter:alpha(opacity:0);opacity: 0;width:260px }/*position:absolute;*/ </style> <div class="jmx-file-box"> <form enctype="multipart/form-data"> <input type='text' name='textfield' id='textfield' class='txt' /> <input type='button' class='btn' value='浏览...' /> <input type="file" name="jmxfile" class="jmxfile" id=jmxfile size="28" onchange="document.getElementById('textfield').value=this.value" /> <input type="button" name="submit" class="btn" value="upload jmx" onclick="ajaxJmxUpload()"/> </form> </div>
结果如下图:
相关文章推荐
- IE8对css文件的限制
- 下拉选项样式整理
- css3 中的content 使用方法。
- css中float属性和position
- css中margin和padding
- CSS3 中FLEX快速实现BorderLayout布局
- css样式表
- css 样式表
- CSS3 中FLEX快速实现BorderLayout布局
- WPF自定义控件与样式(14)-轻量MVVM模式实践
- IE和Chrome样式兼容性问题
- html css 内部有浮动元素的div的高度没有被撑开怎么办【转载】
- CSS水平居中/垂直居中的N个方法 前端开发必收藏
- ANT自动化压缩合并JS/CSS和更改版本号
- CSS5.4 安装问题集
- CSS 常用代码
- 利用 HTML 和 CSS 实现常见的布局
- CSS 尺寸单位
- CSS居中之美
- html/css