摘要：
1、过渡 transition 过渡属性用法： transition :ransition-property transition-duration transition-timing-function transition-delay 可以一起指定也可以分别单独指定 transition-prop 阅读全文
摘要：
所谓的滑动门技术，就是指盒子背景能够自动拉伸以适应不同长度的文本。即当文字增多时，背景看起来也会变长。 大多数应用于导航栏之中，如微信导航栏: 具体实现方法如下： 1、首先每一块文本内容是由a标签与span标签组成 2、a标签只指定高度，而不指定宽度。 3、a标签 设置好背景图后，指定一个paddi 阅读全文
摘要：
有时文字会溢出盒子，这时一般要对文字进行溢出处理。一般有以下三种处理方法： 1、word-break:normal | break-all |keep-all normal 使用浏览器默认的换行 break-all 允许单词内换行即允许单词拆开显示 keep-all 不允许拆开单词显示，连字符除外 阅读全文
摘要：
在网站上经常会有一些需要一定操作才会显示或隐藏的元素，这时会用到元素的隐藏与显示。主要通过以下三种属性实现。 1、display ：none|block |inline |inline-block display常用以上四个属性值，none 是元素隐藏，且不占有位置。block 除了转换为块级元素之 阅读全文
摘要：
定位也是Css中一个非常强大的属性。定位主要是用来移动盒子，将其移动到我们想要的位置。 定位分为两部分 1、边偏移 left | right |top |bottom：偏移大小；（边偏移一般制定上就不指定下，指定左就不指定右） 2、定位模式 position :static| relative |a 阅读全文
摘要：
浮动是一个非常好用的属性，但是有时会出现一些问题，需要进行清除浮动。例如 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, 阅读全文
摘要：
在css中float是一个非常好用的属性，float最基本用法是用来做文字环绕型的样式的。 基本用法：float:left | right 例如 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="vi 阅读全文
摘要：
网页标签可以看成是一个个盒子，页面设计就像垒积木一样，在网页中将盒子摆好显示出来。在浏览器中可以很清楚的去看到一个标签的盒子，具体方法如下： 打开浏览器的开发人员工具，在Elements中选中一个标签，在右侧的styles拉倒最后可以看到这个标签的盒子模型。具体如下图所示： 1、边框 border 阅读全文
摘要：
一些页面会有一些凹凸文字效果，这个主要是设置背景+文字阴影来达成这个效果的。文字阴影使用方法如下： text-shadow: 水平位置 垂直位置 模糊距离 阴影颜色 具体代码如下： body { background-color: grey; } div { color: grey; font-si 阅读全文
摘要：
背景相关属性主要有： background-color 背景颜色 background-image 背景图片 background-repeat 是否平铺 repeat （默认平铺） | repeat-x（水平平铺） | repeat-y （垂直平铺）| no-repeat （不平铺） backgr 阅读全文