51dev.com IT技术开发者社区

51dev.com 技术开发者社区

CSS如何清除浮动流的多种方案

CSS如何清除浮动流的多种方案

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Document</title></head><style>.wrapper{border:20p...

css实现两边有缺口的卡券效果

css实现两边有缺口的卡券效果

自己项目用到优惠券的样式,特拿来分享。主要用到了css的position:absolute属性。 效果如下图:  <!DOCTYPEhtml><htmllang="zh-cn"><head><metacharset="UTF-8"><t...

小程序wxss和css3的区别

小程序wxss和css3的区别

0.wxss不能直接通过css3中的background-image属性来设置显示的背景图片。例如我在wxss中书写如下background-image:url(imageB.png);控制台打印:pages/index/index.wxss中的本地资源图片无法通过WXSS获取,可以使用网络图片,或者base64,或者...

css模型之层模型

css模型之层模型

css层模型说的是position这个属性,它有四个常用值,分别是static、relative、absolute、fixed。1.static:这个是元素的默认值,特点是页面会依照自左向右、自上向下的方向布局,并且设置top、right、bottom、left值是没有用的,并且设置z-index也是没有用的,不能进行...

css中使input输入框与img(图片)在同一行居中对齐

css中使input输入框与img(图片)在同一行居中对齐

display:inline;...

CSS在超出宽度后显示省略号…代码

CSS在超出宽度后显示省略号…代码

display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;必须要有个宽度...

html怎样设置鼠标指针样式

html怎样设置鼠标指针样式

可以用css来统一设置,也可以单独对标签进行设置。Auto<span>Auto</span>Crosshair<span>Crosshair</span>Default<span>Default</span>Pointer<span>P...

div中p标签自动换行

div中p标签自动换行

只需要设置div的width属性,p标签加上word-break:break-word属性就会自动换行----------------2016.7.1--------------------今天在评论列表中也遇到了这个问题,并且只有英文会出现顶开容器的现象,仔细找了一下资料,因为在排版上,CJK(ChineseJapa...

移动端border:1px问题解决方案

移动端border:1px问题解决方案

了解设备像素和css像素的因该知道,通常我们在写移动端时,是按照设计稿标注的像素除以设备的DPR来写真实的像素,比如在iPhone6上,我们写的20px字体世界上在视觉效应上有20px;所以当我们写1px边框时,在手机上看起来会变粗变为2px;对此有如下解决方案:.border-1px(@color){position...

sticky footer 布局

sticky footer 布局

在开发中常遇见这种问题,我们需要将底部固定在页面的最下方;无论正文内容的高度是多少;如果直接用fixed定位:bottom为0;那么当正文过多时,底部将会与正文重叠;代码如下:html:<divclass="container"><divclass="content"><p>Lore...

CSS中关于list-style与inline的使用方法详解

CSS中关于list-style与inline的使用方法详解

以前只用到list-style:none;这种方式,原以为也只这种方式呢,这个方式只不过是让li前的标记去掉而已,下面为大家介绍下CSS:list-style和inline用法详解,感兴趣的朋友不要错过平时只顾着写程序,写p或span或ulli之类的,常常遇到一莫名的问题,自己的解决方式可能是top:-10px也可能f...

微信小程序之css3 display

微信小程序之css3 display

一displaydiaplay改变标签的模式,行内装块级(block),块级转行内(inline)   通过设置display为none,可以让整个标签在页内移除掉设置visibility为hidden也可以让控件不显示,但是回占用位置   设置display...

如何使用CSS设置Checkout样式的示例代码

如何使用CSS设置Checkout样式的示例代码

如何使用CSS设置Checkout样式的示例代码<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title>CSS3自定义Checkbox特效</title></head><styl...

display:none和visibility:hidden的区别

display:none和visibility:hidden的区别

visibility和display两个属性都有隐藏元素的功能,display:none和visibility:hidden的区别,简单的总结一句话就是:visibility:hidden隐藏,但在浏览时保留位置;而display:none视为不存在,且不加载! 1、visibility:hidden->...

css3 :nth-child()伪类选择器实现奇偶行显示不同样式

css3 :nth-child()伪类选择器实现奇偶行显示不同样式

css3的强大,让人惊叹,人们在惊喜之余,又不得不为其艰难的道路感到可惜:好的标准只有得到行业浏览器的良好支持才算得上“标准”。CSS3标准已提出数年,但是目前能实现她的浏览器并不多,虽然部分浏览器能实现部分规范,但这又有什么用呢?面对更多的兼容性问题,CSSer们只有望洋轻叹。虽然如此,但有前...