随笔分类 - css
摘要：原文地址： https://hackhands.com/70-Expert-Ideas-For-Better-CSS-Coding/ 众成翻译：http://www.zcfy.cc/article/70-expert-ideas-for-better-css-coding-hackhands-107
阅读全文
摘要：观察上图不难发现，送至北京（上方div） 这部分的边框情况是，上侧无边框，左右有边框，而下侧则不知道。 鼠标指向后下方div（下方div）出现，四周都有边框，除了与上方送至北京交接处，此时出现一个拐角，而这个拐角正是本文着重研究的。 怎样形成这个拐角呢？或者说怎样让交接的这部分看起来没有边框呢？ 这
阅读全文
摘要：两个方面。 1.21布局，推荐position:absolute;(此题要求3个div),左边两个position:absolute;设置好top与left。右边div设置好margin。 2.js部分 附RUNJS：http://runjs.cn/code/y2amstgb
阅读全文
摘要：photoshop cc 自带的图层“css复制”功能，对图层右键后可进行css复制，支持渐变等特效。 但是会有无效的position属性，很大的妨碍了书写css的速度。 一个插件：https://github.com/Linrstudio/PhotoshopCopyCSS 安装后 用于增强 Pho
阅读全文
摘要：RUNJS地址：http://runjs.cn/code/acqs9fdd 主要用了 1.position：fixed;设置标签相对当前窗口的位置。 2.scroll()方法：监听滚动条 3.scrollTop()方法:窗口中滚动条的垂直偏移 html代码： css代码： javascript代码：
阅读全文
摘要：1.display:none;（推荐） 隐藏后，页面元素真正隐藏，不会占空间 2.visibility:none; 隐藏后，页面元素的空间会呈空白状（占空间）。 3.position设置为absolute，然后top或者left设置为-999999，即远超出页面。
阅读全文
摘要：方法1：body{scroll:no;} 方法2： body{ overflow-x:hidden;//水平隐藏 overflow-y:hidden;//垂直隐藏 } 或者 body{ overflow:hidden; } 这只是简单的隐藏方法，具体引起的后果还有待探索
阅读全文
摘要：inline与block最直观的区别，内联元素可以多个在一行，而块级元素独占一行，两者可以互相转换。 display：inline； 内敛元素，width与height无效，不会独占一行，margin和padding只有水平属性会生效。 display：block； 块级元素，可以设置width与h
阅读全文
摘要：当使用浮动float时，如果父div没有使用float，而子div使用了float，则可能出现以下情况： 是的，本来应该被撑开的父div却没有被撑开，这很尴尬。 那么应该如何处理这个浮动问题呢？ 1.最简单的做法：设置父类高度。 将父类的div设置为固定高度，但是如果子类的高度大于父类高度之后，经r
阅读全文
摘要：有三个div，div1、div2左浮动float：left，div3右浮动float：right，宽度为50%，border为1px，然而由于border宽度不在width范围内，所以最终效果如下： 一种方法，利用box-sizing属性设置三个子div，即加入box-sizing:box-bord
阅读全文
摘要：效果展示如下: 其中图片的宽度是一定的，高度随比例变换，以此为基础做瀑布流布局。
阅读全文
摘要：RunJS地址：http://runjs.cn/detail/vnhi5yuw 在本次的练习中，css分析如下
阅读全文
浙公网安备 33010602011771号