1,在浮动元素后面增加<br/>标签;<br/>标签有自带的清除浮动属性;2,在浮动元素后面增加一个清除浮动层;<div><div style="float:left"></div><div style="float:left"></div><div style="cl
......
466
0
0
2022-06-29
上次在讲css实现tab切换时,有童靴留言说可以使用锚点实现,对的,就是可以使用锚点,然而,使用锚点涉及到的又有哪些关键技术了?今天我们以锚点实现弹窗为例来解答这个问题一句话总结实现原理就是:a标签改变hash值触发css3伪类target作用对应id的dom元素。一:讲清楚:target怎么作用的:target是CSS里一个非常有趣的伪选择器。它在CSS里
......
614
0
0
2022-06-27
《一款APP设计的从0到1》这是一篇系列文章干货,上次U妹讲的是关于APP项目立项和预估时间篇,今天U妹来说一下,APP界面设计和iPad界面设计规范。往期回顾:《一款APP设计的从0到1之:项目立项篇》《一款APP设计的从0到1之:项目预估时间篇》这次U妹接着上次的茬继续,继续之前先来看看整个目录(满满的干货)U妹列了一个小小的目录:一、项目立项二、项目预
......
518
0
0
2022-06-25
在面对丰富尺寸的移动端时,Iphone、安卓各种屏幕分辨率,智能手机品牌、机型如此众多的今天,各种不规则的分辨率,即使作为专业团队的我们切版网,也很难寻找到所有的真机一一去测试。无论我怎么去调试,都会有比例上的不一样的问题。这就会导致不能很好的还原设计。解决办法当然是有的,那就是使用REM!首先让我们带您一起理解一下remrem是CSS3新增的一个相对单位(
......
469
0
0
2022-06-23
外人说:切图就是把图片切碎百度说:切图是指将设计稿切成便于制作成页面的图片,并完成html+css布局的静态页面。通俗来讲,把一张设计图 利用到切片工具 把自己所需的切成一张张小图,然后用DIV+CSS完成静态页面书写,完成CSS布局。切图大家都有个误区,觉得切图就是把图片切出来,其实并不完全是这样,把图片切出来这个过程是叫切片。切图的目的:第一个是让网页稿
......
352
0
0
2022-06-20
好的前端必定有好的css命名,怎么算好的命名? 这是一个永恒的课题,最近看了张鑫旭博客如醍醐灌顶。精简高效CSS命名之“三无原则”无ID,无层级,无标签好的命名不仅要描述 它的功能,要直观,要简洁,对于英语不过4级的我,那简直了所以早期,我尝试过这样命名,通篇的拼音命名法/*关于页面*/.guanyu{}.guanyu_left{}.guanyu_wrap{
......
496
0
0
2022-06-16
尖荷说:很多时候设计师在工作中,老板会突然跑过来问你要一个图。你赶忙返回电脑桌面,却发现桌面早已被乱七八糟的素材图和“未标题1”,未标题2,3,4,“最终版”,“最终版的最终版”所占满。这时你无法确定哪个是最终定稿的PSD文件,只能一个一个打开文件看,开的多了,软件崩溃,电脑死机,老板一声叹气默默走开。而你,欲哭无泪。设计师每天与各种软件打交道,文件多了电脑
......
619
0
0
2022-06-16
最近到处看到有人在说CSS3的filter一直没有时间自己去测试这效果。今天终于抽出时间学习这个CSS3的Filter。不整不知道呀,一整才让我感到吃惊,太强大了。大家先来看个效果吧:我想光看上面的效果就能吸引你了,要是你自己动手的话,我想您更会感到神奇。细一看,这些效果就像是photoshop整出来的一样,其实是真是这样的,有很多效果都是类似于photos
......
581
0
0
2022-06-14
小伙伴们,css3单位你们听说过多少?我们在前端切图项目中用到的有px,em,rem,vh,% 其他基本没用到过了。特别是vh ,特别好用。附所有css单位,应该是最全的了px:绝对单位,页面按精确像素展示em:相对单位,基准点为父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是16px),整个页面内1em不是一个固定的值。re
......
474
0
0
2022-06-12
前端开发是一个比较繁琐的工作,不仅要有别人不一样的审美观和设计观,还需要了解很多的JS插件等错综复杂的技术,一份工作在别人眼中看似简单,其实当做的,完成的时候又是另一回事了。以下推荐几款还不错的css框架,希望能对大家工作中有所帮助。1、Twitter开源杰作 -BootstrapBootstrap基于HTML、CSS和JavaScript,是一款非常适合敏
......
428
0
0
2022-06-12
颜色是用户在你的网站上注意到的第一个体验。运用这些专业设计的色彩搭配,足以吸引用户的眼球。特别是需要建立线上形象的企业而言是绝对有必要的。除了创造自己专属的网站之外,网站的外观和框架都应该配合品牌和产品。我们知道色彩心理学与品牌塑造有密切的关系;与特定颜色相关的色调和格调能够让用户感受到品牌的属性。比如主色调为绿色的品牌看起来可能偏向自然与环保,而使用粉红色
......
819
0
0
2022-06-08
在做网页的时候经常要实现一些类似于标签的标识,这时很多人会使用图片去实现,当然这是一种做法,还有另外一种做法就是利用CSS3的属性来实现该效果!下面看看效果图:要实现该效果原理就是右边定位一个三角形,然后下面的夹角也是定位一个小三角形就可以实现如图所描述的效果!下面来看看简要的代码:html:主要CSS:主要通过css伪类来添加2个三角形的效果,实现标签效果
......
534
0
0
2022-06-08
效果图废话不多说,上源码!大家可以关注收藏,方便下次观看需要文档版本源码,可以加我的HTML5前端交流群111645711zzsc.cssbody{
background: #494A5F;
color: #D5D6E2;
font-weight: 500;
font-size: 1.05em;
font-f
......
489
0
0
2022-06-04
当文章中的长文本被自动断行为多行文本时,其样式可能会出乎我们的设计。本文介绍如何使用CSS3中的box-decoration-break特性来处理多行元素样式。按照规范定义,box-decoration-break被用来处理分页(page-break)或断行(line-break)时元素的样式。默认情况下,当我们设置元素背景(background)或边界(b
......
396
0
0
2022-05-31
大家都知道,web前端开发并不是每一个环节都是从无到有的,有时候我们需要借用别人的经验,借鉴和运用一些流行和优质的模板,这样能够做到事半功倍,更能吸取精华增长自己。做技术,会运用模板也是一门技能哦~今天码疯窝编程君给大家分享一打流行的web开发前端模板集锦,模板在手,开发不愁~HTML5 BOILERPLATEHTML5 Boilerplate 帮你构建 快
......
477
0
0
2022-05-24