最新消息:文章中包含代码时,请遵守代码高亮规范!

HTML+CSS

利用offset实现楼层效果【原创】

HTML+CSS Aimee 1年前 (2018-01-24) 679浏览 0评论

在一些商城网站,我们经常能够看到楼层效果,以城市为例,将城市的拼音的首字母大写,绝对定位于屏幕的右下角。当点击某一个字母时,跳转到相对应的城市类别位置。当屏幕滚动时,相对应的英文字母高亮显示。 以下附上示例代码: 在查看示例前先了解一下offset(...

使用@media screen实现网页的自适应布局【转载】

HTML+CSS Aimee 1年前 (2018-01-24) 713浏览 0评论

在项目开发中,为了适应不同屏幕大小的移动设备,我们可以利用@media screen属性,实现自适应布局。因为@media screen属性能够根据浏览器宽度判断并执行相对应的操作。 以下示例为五种不同分辨率时的显示不同的背景颜色。 1280分辨率...

link和@import的区别【转载】

HTML+CSS Aimee 1年前 (2018-01-24) 577浏览 0评论

页面使用css的方式主要有3种,标签行内引用,页面头部样式引用,外部样式引用,其中外部样式引用有link和import俩种; link和import都可以对css样式进行外部引用,但它们还是有区别的。 link语法: <link rel="st...

如何解决ie7下z-index失效bug【原创】

HTML+CSS Cindy 1年前 (2018-01-18) 630浏览 0评论

之前在写项目的时候,有时候经常会用到定位,在ie7浏览器下有时候定位元素设置z-index有时候会失效,会被其他元素覆盖在上面。 具体解决办法如下: 给父级元素加上position:relative,并设置z-index。 父级元素的z-index优...

如何清除浮动?【转载】

HTML+CSS Cindy 1年前 (2018-01-18) 613浏览 0评论

浮动对页面的影响: 如果一个父盒子中有一个子盒子,并且父盒子没有设置高,子盒子在父盒子中进行了浮动,那么将来父盒子的高度为0.由于父盒子的高度为0,下面的元素会自动补位,所以这个时候要进行浮动的清除。 关于清除浮动的四种方式: 方式一:使用ove...

为什么清除浮动?清除css浮动的三种方法【原创】

HTML+CSS 陈, 梦娟 1年前 (2018-01-18) 755浏览 0评论

一,我们为什么要浮动 为什么浮动,为什么要清除浮动,以及清除浮动的方法。在网页布局的时候有时需要元素并排显示,如果不选择浮动,那么那些块状元素就会一行一行显示,占用空间不说,用户体验也是极为不好的。 以下是没有浮动的元素代码 <di...

前端表单验证常用的15个JS正则表达式【转载】

HTML+CSS harbour 1年前 (2018-01-13) 518浏览 0评论

在表单验证中,使用正则表达式来验证正确与否是一个很频繁的操作,本文收集整理了15个常用的javaScript正则表达式,其中包括用户名、密码强度、整数、数字、电子邮件地址(Email)、手机号码、身份证号、URL地址、 IPv4地址、 十六进制颜色、...

用div模拟select下拉菜单【原创】

HTML+CSS Cindy 2年前 (2017-12-19) 799浏览 0评论

select下拉菜单在不同版本的浏览器下显示的样式会有所不同,特别是在ie低版本中,select自带的样式去不掉。以下是用div来模拟select下拉菜单具体代码: <!DOCTYPE html> <html lang=&qu...

巧妙运用css让弹窗居中【原创】

HTML+CSS Cindy 2年前 (2017-12-19) 1004浏览 0评论

在开发项目时,有时候需要登录界面或者弹窗要始终居中在电脑屏幕中间,由于屏幕大小不确定,不用js,仅用margin-top和margin-left难以使弹窗刚好显示在屏幕中间。 以下是实现弹窗居中具体代码,大家可以参考一下。 弹窗样式代码: .ma...

Ios,Android,H5的部分交互【原创】

Android Aimee 2年前 (2017-12-18) 952浏览 0评论

现在的大部分app应用中,已经充斥着占比很高的H5页面或者元素,那么,在h5页面中如何实现与IOS和Android的交互呢,以下做部分交互的简单介绍: 例如:传递参数并执行pushView()方法。 $('body').on('click','.di...

css3实现的3D旋转爱心相册【原创】

HTML+CSS Jonny 2年前 (2017-12-18) 587浏览 0评论

这是前一段时间学习css3,在网上看一个老师的公开课上讲的一个小案例,觉得挺有趣的,而且也能帮助熟悉css3的一些代码,所以第二天自己就尝试着写一个出来。由于对css3的代码不熟悉,花了小半天时间,最后还是败在IE的兼容上面。今天发出来是给大家提供一...

js+css实现全屏【转载】

HTML+CSS Cindy 2年前 (2017-12-17) 725浏览 0评论

在html5中,全屏方法可以适用于很多html 元素,不仅仅是video。以下是实现全屏具体代码: css样式: *{ padding: 0px; margin: 0px; } body div.videobox{ width: 400px; hei...

正则表达式书写规范【转载】

HTML+CSS Aimee 2年前 (2017-11-19) 748浏览 0评论

在完成项目的过程中,我们遇到的限制输入框输入内容的正则表达式的书写规范都是怎样的呢?以下转载的内容做出了详细的介绍,并举例说明,便于理解: ^ :匹配开头,$:匹配结尾 ; /^ve/以ve开头的 /ve$/以ve结尾 \d:一个任意的数字 \w:一...