css
xiaxiaoxian
这个作者很懒,什么都没留下…
展开
-
美化浏览器的radio和checkbox样式
先讲一下原理:checkboxhack技术我们使用 CSS 一些特殊的选择器,然后配合单选框以及复选框自带的一些特性,可以实现元素的显示隐藏效果。然后通过一些简单的扩展,我们可以不使用任何 JavaScript 代码实现类似:自定义的单复选框,“更多”展开与收起效果,选项卡切换效果,或是多级下拉列表效果等等。相信很多前端开发人员都会遇到 boss 让修改 checkbox 和 radio 样式,毕...原创 2018-02-08 10:53:47 · 636 阅读 · 0 评论 -
使用CSS修改HTML5 input placeholder颜色
::-webkit-input-placeholder { /* WebKit browsers */ color: #999;}:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #999;}::-moz-placeholder { /* Mozilla Firefox 19+ */ col...原创 2018-04-20 15:20:51 · 700 阅读 · 0 评论 -
如何将引入的iframe页面缩小,适应当前页面
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, m原创 2018-11-29 23:24:49 · 11723 阅读 · 0 评论 -
深入理解BFC
一、什么是BFCFormatting context 是 W3C CSS2.1 规范中的一个概念。它是页面中的一块渲染区域,并且有一套渲染规则,它决定了其子元素将如何定位,以及和其他元素的关系和相互作用。最常见的 Formatting context 有 Block fomatting context (简称BFC)和 Inline formatting context (简称IF...原创 2019-01-03 18:35:33 · 202 阅读 · 0 评论 -
如何清除浮动
一、浮动到底是什么?二、浮动有什么特点?浮动的特点,可以用八个字总结:脱标、贴边、字围和收缩。为了更好说明,请看下图:当框 1 向左浮动时,它脱离文档流(脱标)并且向左移动(贴边),直到它的左边缘碰到包含框的左边缘。因为它不再处于文档流中,所以它不占据空间,实际上覆盖住了框 2,使框 2 从视图中消失。如果框2中有文字,就会围着框1排开(字围)。如果把所有三个框都向...原创 2019-01-03 19:03:39 · 1475 阅读 · 0 评论 -
如何居中一个元素(终结版)
一、水平居中1.行内元素水平居中利用 text-align: center 可以实现在块级元素内部的行内元素水平居中。此方法对inline、inline-block、inline-table和inline-flex元素水平居中都有效。 .parent{//在父容器设置 text-align:center; }此外,如果块级元素内部包着也是一个块级...原创 2019-01-04 11:18:01 · 147 阅读 · 0 评论 -
几种常见的CSS布局
一、单列布局常见的单列布局有两种:header,content和footer等宽的单列布局 header与footer等宽,content略窄的单列布局 1.如何实现对于第一种,先通过对header,content,footer统一设置width:1000px;或者max-width:1000px(这两者的区别是当屏幕小于1000px时,前者会出现滚动条,后者则不会,显示出...原创 2019-01-04 16:01:35 · 980 阅读 · 1 评论 -
CSS三栏布局的四种方法
1.绝对定位法<div class="left">Left</div><div class="main">Main</div><div class="right">Right</div>body,html{ padding: 0px; margin原创 2019-01-04 17:47:15 · 245 阅读 · 0 评论 -
单行文本溢出显示省略号,单行文本溢出显示省略号
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>萧山城管11</title></head><body> <style> .div_text{ w原创 2019-02-11 10:10:03 · 367 阅读 · 0 评论