移动适配的2种方法与响应式站5大开发技巧
css3

移动适配的2种方法与响应式站5大开发技巧

109

白龙网发现,媒体查询是根据不同的视口宽度,执行不同的CSS。它是由关键词@media、视口宽度(width:30px)、样式{选择器:{}}等三部分组成。手机屏幕大小不同,分辨率不同,可以使用媒体查询来...

FLEX布局要搞明白:主轴侧轴与行的对齐方式以及强制换行换方向
css3

FLEX布局要搞明白:主轴侧轴与行的对齐方式以及强制换行换方向

402

白龙网指出,屏幕分辨率是以a*b这种形式展示的,单位是px,表示宽度为a像素,高度为b像素;分为物理分辨率(出厂设置好的,无法改变的)、逻辑分辨率(可由软件驱动设置的)两种。就PC端而言,也可以理解为默认的是物理分辨率,用户自己设置的是逻辑分辨率。例如,谷歌浏览器上的手机模拟器上显示的iphone6、7、8分辨率375*667,它就是个逻辑分辨率,一般来说,物理分辨率...

css3走马灯动画效果·会用其7个参数即可
css3

css3走马灯动画效果·会用其7个参数即可

145

白龙网特别提醒,动画要先定义(关键词、花括号、从A到B),后使用(关键词:动画名称 动画时间,两个参数之间用空格隔开)。可以定义两个状态之间的转换(from/to),也可以定义多个状态之间的转换(百分比)。...

CSS3高级效果之平面转换:位置、旋转、缩放、渐变
css3

CSS3高级效果之平面转换:位置、旋转、缩放、渐变

82

在白龙网看来,字体图标展示的是图片,本质上是字体,主要用来处理简单的图片效果,复杂的图标还是要用精灵图实现。灵活性(可修改字体、尺寸等样式)、兼容性(支持主流浏览器)、轻量级(体积小,渲染快)、使用方便(下载字体,使用图标)。...

前端开发九条经验·助力码农高效搬砖
css3

前端开发九条经验·助力码农高效搬砖

198

白龙网在使用pxcook测量psd文件外边距时,一般要在开发模式下进行,分两种情况,以元素A为参照物,如果要测试元素A到元素B之间的距离,我们要把这个外边距放到元素A上,那么首先要选中A元...

CSS搞明白11大技能·开发企业站手到擒来
css3

CSS搞明白11大技能·开发企业站手到擒来

161

在白龙网看来,CSS是层叠样式,引入方式有3种,一是内嵌式,css写在style材中,理论上说style标签可以放在网页的任意位置,但是往往style标签会放在head标签下;二是外联式,css写入外部CSS文件...

优秀的前端人员需要具备哪些技能?
css3

优秀的前端人员需要具备哪些技能?

194

在白龙网看来,作为一们前端人员,对必须要全部掌握最新的、最前端的技术,譬如html5,css3,JavaScript,VUE、uniapp等。下面,为大家梳理了一下前端开发人员要掌握的基本技能。...

flex布局:6个容器属性与6个项目属性
css3

flex布局:6个容器属性与6个项目属性

280

页面布局的传统解决方案,基于盒状模型,依赖display属性 + position属性 + float属性。它对于那些特殊布局非常不方便,比如,垂直居中就不容易实现。2009年,W3C提出了一种新的方案—-Flex布局,...

阿里巴巴矢量图标库Iconfont的使用方法
css3

阿里巴巴矢量图标库Iconfont的使用方法

219

建站是每个SEOer的必备技能之一。期间,会遇到各种各样的小图标,用PS或者CSS/HTML都可以直接画出来。显然,这两种方案在效率上都差强人意。最直接、最快速的方法当然是引用第三方现成的icon图标了,譬如“Iconfont-阿里巴巴矢量图标库”。下面来说说具体的使用方法、操作步骤。...

CSS单位与颜色值
css3

CSS单位与颜色值

168

可以用以下方法来规定CSS中的颜色:十六进制色、RGB颜色、RGBA颜色、HSL颜色、HSLA颜色、预定义/跨浏览器颜色名。...

css3多列布局与用户界面设置
css3

css3多列布局与用户界面设置

102

通过CSS3,能够创建多个列来对文本进行布局 - 就像报纸那样. Internet Explorer 10和Opera支持多列属性。Firefox需要前缀-moz-。Chrome和Safari需要前缀-webkit-。Internet Explorer9以及更早的版本不支持多列属性。...

css3过渡属性与动画特效
css3

css3过渡属性与动画特效

88

通过CSS3,我们可以在不使用Flash动画或JavaScript的情况下,当元素从一种样式变换为另一种样式时为元素添加效果。要实现这一点,必须规定两项内容:规定您希望把效果添加到哪个CSS属性上;...

css3的2D转换与3D转换
css3

css3的2D转换与3D转换

113

通过CSS3转换,能够对元素进行移动、缩放、转动、拉长或拉伸,通过translate()方法,元素从其当前位置移动,根据给定的left(x坐标)和 top(y坐标)位置参数....

css3边框、背景、文本效果、字体
css3

css3边框、背景、文本效果、字体

88

通过CSS3,能够创建圆角边框,向矩形添加阴影,使用图片来绘制边框 - 并且不需使用设计软件。例如:border-radius、box-shadow、border-image...