css
文章平均质量分 57
红尘客栈-古月
这个作者很懒,什么都没留下…
展开
-
css禅院
转载自:http://www.csszengarden.com/用CSS设计的非常美的页面转载 2017-08-08 12:07:10 · 217 阅读 · 0 评论 -
no-repeat 失效
background-image:url(../images/close.png) no-repeat; /*显示小图*/ 最后的结果无效,图片消失不见,如果改为如下background-image:url(../images/close.png); /*显示小图*/ 结果为布满多个图片如果改为如下backgroun原创 2017-08-24 01:32:32 · 3876 阅读 · 1 评论 -
:after伪类+content 清除浮动的影响实例页面
转载自:http://www.zhangxinxu.com/study/201009/after-content-clear-float.htmlCSS代码:.box{padding:10px; background:gray;}.fix{*zoom:1;}.fix:after{display:block; content:"clear"; height:0; clea转载 2017-08-28 09:23:57 · 350 阅读 · 0 评论 -
多个css合在一起写
.right .icona,.icona,.iconb,.iconc,.icond,.icone,.iconf{//注意:有两个icona,如果只有一个的话,icona就不会有设置效果,所以要增加一个,height:50px;width:100px;background-image:url(../images/close.png); /*显示小图*/原创 2017-08-24 01:52:47 · 5548 阅读 · 0 评论 -
css border属性
转载自:http://www.divcss5.com/rumen/r120.shtml#top欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!CSS手册CSS3手册CSS论坛CSS培训CSS任务网闻DIV+CSS学习与CSS资源分享平台首页HTML基础HTML入门HTML5转载 2017-08-29 16:47:45 · 663 阅读 · 0 评论 -
css 绘制三角形箭头
转载自:http://ourjs.com/detail/532bc9f36922aa7e1d000001OurJS阅读 全端 发布 订阅邮件 用纯CSS实现的箭头分享到分类 编程技巧 关键字 Html5 发布 newghost 2转载 2017-08-29 16:49:22 · 639 阅读 · 0 评论 -
class类命名
转载自:http://www.cnblogs.com/allenc/p/5178119.htmlAllenC博客园首页新随笔联系订阅管理随笔 - 2 文章 - 0 评论 - 0class如何命名更规范相信写css的人都会遇到下面的问题: 糟糕,怎么命名这个cl转载 2017-08-29 16:51:05 · 4969 阅读 · 0 评论 -
深入理解CSS:font metrics, line-height 以及 vertical-align
转载自:http://web.jobbole.com/91180/深入理解CSS:font metrics, line-height 以及 vertical-align2017/04/28 · CSS · 2 评论 · font metrics, line-height, vertical-align分享到:1原文出处: Vincent转载 2017-09-01 16:54:18 · 698 阅读 · 0 评论 -
css中的权重
转载自:http://www.w3cplus.com/css/css-specificity-things-you-should-know.html跳转到主要内容w3cplusCSS3JavaScriptReactVueMobileSass译文SVG视频教程标签云RSS转载 2017-09-22 09:29:40 · 477 阅读 · 0 评论 -
css代码规范
前端规范之CSS1. tab键用(必须)四个空格代替 因为在不同系统的编辑工具对tab解析不一样,windows下的tab键是占四个空格的位置,而在linux下会变成占八个空格的位置(除非你自己设定了tab键所占的位置长度)。 一些童鞋可能会有疑问,tab键换成四个空格,多麻烦啊~ 其实不然,我平时用sublime text比较多,在这个工具中可以对tab键进转载 2017-11-29 18:31:37 · 194 阅读 · 0 评论 -
用伪类画线条、圆点
画线条:login_conten是父标签,h1是子标签.login_content { position: relative; text-align: center; } h1{font: 1.285rem PingFang-SC-Bold;color: #FF6600;} /*CSS伪类用法*/ .login_c原创 2017-11-22 17:51:01 · 5437 阅读 · 0 评论 -
addclass和css()的区别
转载自:https://www.yuanmas.com/info/9ezZE31O67.html对于样式的设置,addClass与css方法两者之间有什么区别?可维护性:.addClass()的本质是通过定义个class类的样式规则,给元素添加一个或多个类。css方法是通过JavaScript大量代码进行改变元素的样式通过.addClass()我们可转载 2017-12-06 12:17:08 · 1666 阅读 · 0 评论 -
解决输入文字换行的方法:
用textarea标签:例子:html: textarea{css:line-height: 30px; //使两行的高度看起来一样border: 0;/* outline: none;*/}注意:标签中间不能有空格,否则点击输入框,光标不会在左上角位置。原创 2017-12-06 17:08:08 · 1643 阅读 · 0 评论 -
何时使用img标签,何时使用background-image背景图像
转载自:http://www.cnblogs.com/zjBoy/p/3729550.html何时使用img标签,何时使用background-image背景图像 在什么情况下更适合使用HTML IMG标签来显示一个图像,而不是一个CSS有背景图像,反之亦然? 如下场景使用img标签比较合适: 1、如果图像是等内容的一部分或图表或人(真正转载 2017-08-24 00:51:35 · 1293 阅读 · 0 评论 -
子元素相对于父元素设定margin-top值的时候
子元素相对于父元素设定margin-top值的时候,怎么办?记得是父元素没有边界,可以加border-top: 1px solid red;解决方法:1、修改父元素的高度,增加padding-top样式模拟2、为父元素添加overflow:hidden;样式即可3、为父元素或者子元素声明浮动4、为父元素添加bo原创 2017-08-24 00:16:37 · 782 阅读 · 0 评论 -
浏览器兼容
转载自:http://www.cnblogs.com/HughTan/archive/2013/08/28/3287250.htmljavascript部分1. document.form.item 问题 问题: 代码中存在 document.formName.item(“itemName”) 这样的语句,不能在FF下运行 解决方法: 改用 document.for转载 2017-08-04 23:22:13 · 156 阅读 · 0 评论 -
用css画三角形
div的border都设为width的一半,颜色三个为透明,一个为不透明原创 2017-08-13 00:12:36 · 234 阅读 · 0 评论 -
CSS优化
转载自:https://www.zhihu.com/question/19886806我复制规则过来:修复解析错误(Parsing errors should be fixed)避免使用多类选择符(Don't use adjoining classes)IE6以及更古老的浏览器对类似.foo.bar的多类选择符解析不正确,参考IE6下的多类选择符一文转载 2017-08-20 18:22:01 · 187 阅读 · 0 评论 -
发现css书写问题,提升性能的工具
转载自:http://csslint.net/检测css用的工具转载 2017-08-20 18:26:10 · 159 阅读 · 0 评论 -
css sprites将多张图片合并成一张
div,ul,li,h3{margin:0; padding:0;}ul,li{list-style:none;}div{margin:50px; float:left; font-size:12px; width:200px; background:#eee;}h3{height:28px; line-height:28px; padding-left:15px; background:#ccc; border-bottom:1px solid #aaa;}ul{overflow:hidden;原创 2017-08-21 14:20:32 · 1897 阅读 · 0 评论 -
css sprite新手教程
转载自:http://ons.me/125.htmlCSS Sprites新手教程刚开始认真学习CSS的时候,发现一个CSS Sprites教程。后来群里的朋友问起这个问题,我很想把那个教程发给他看看,但是已经找不到了,所以就一直想自己写个CSS Sprites教程。这几天写网页的时候恰巧用到了CSS Sprites,就写出来,分享给各位刚学习CSS原创 2017-08-21 15:00:13 · 5495 阅读 · 0 评论 -
这可能是史上最全的CSS自适应布局总结
转载自:http://web.jobbole.com/86080/所谓布局,其实包含两个含义:尺寸与定位。也就是说,所有与尺寸和定位相关的属性,都可以用来布局。大体上,布局中会用到的有:尺寸相关的盒子模型,普通流、浮动、绝对定位三种定位机制,CSS3中的transform、弹性盒子模块、试验中的grid模块。逛园子的时候经常可以看到浮动布局,inline-block转载 2017-08-24 16:48:16 · 332 阅读 · 0 评论 -
自适应网页设计
转载自:http://www.ruanyifeng.com/blog/2012/05/responsive_web_design.html自适应网页设计(Responsive Web Design)作者: 阮一峰日期: 2012年5月 1日随着3G的普及,越来越多的人使用手机上网。移动设备正超过桌面设备,成转载 2017-08-24 17:17:10 · 468 阅读 · 0 评论 -
巧用margin/padding的百分比值实现高度自适应(
转载自https://segmentfault.com/a/1190000004231995巧用margin/padding的百分比值实现高度自适应(多用于占位,避免闪烁)布局 自适应 前端 css array_huang 2015年12月31日发布赞 | 14 收藏 |转载 2017-08-24 18:15:07 · 3425 阅读 · 0 评论 -
用padding还是margin
转载自:http://www.hicss.net/use-margin-or-padding/用Margin还是用Padding分类: Html/CSS | 转载请注明: 出自 海玉的博客 本文地址: http://www.hicss.net/use-margin-or-padding/用margin还是用padding这个问题是每个学习CSS进阶时转载 2017-08-23 11:16:34 · 280 阅读 · 0 评论 -
移动端布局
body{font-family: helvetica;margin:0;}body *{-webkit-text-size-adjust:100%;/*横竖屏切换时,字体可能会变化,用户通过自己的浏览器也可以设置字体的大小/*/-webkit-user-select:none; 在ios设备下长时间按住某个字时,禁止用户选中这个文字}原创 2017-08-27 22:09:05 · 189 阅读 · 0 评论 -
viewport
转载自:http://www.cnblogs.com/2050/p/3877280.html移动前端开发之viewport的深入理解在移动设备上进行网页的重构或开发,首先得搞明白的就是移动设备上的viewport了,只有明白了viewport的概念以及弄清楚了跟viewport有关的meta标签的使用,才能更好地让我们的网页适配或响应各种不同分辨率的移动设备。一、v转载 2017-08-27 22:55:51 · 209 阅读 · 0 评论 -
清楚浮动
方法一:父元素:.clearfix{clear:both;}子元素:.child{float:left;}方法二:父元素:parent{overflow:hidden;}子元素:.child{float:left;}原创 2018-01-05 16:49:11 · 209 阅读 · 0 评论