500px

html + css 面试

html + css 面试

caption 标签必须紧随 table 标签之后,您只能对每个表格定义一个caption 标签。文本缩进 & 版权符号文本缩进不要使用特殊符号 应当使用CSS进行设置。为了减少 HTTP 请求数量,可以通过这些工具再发布前将多个CSS或者多个JS合并成一个文件。一般情况下都是CSS在头部,JS在底部。减少Reflow,如果需要在DOM操作时添加样式,尽量使用 增加class属性,而不是... »

通过css3背景控制属性+使用颜色过渡实现渐变效果

css3背景图像相关兼容性:IE9+background-clip 背景图片绘制区域background-clip:border-box; 内容区Document div{ width: 500px; height: 500px; background:url(source/p3.jpg) center; »

基于匀速运动的实例讲解(侧边栏,淡入淡出)

基于匀速运动的实例讲解(侧边栏,淡入淡出)

javascript中,如何让一个元素(比如div)运动起来呢? 设置基本的样式,一定要让div有定位( 当然用margin的变化也可以让元素产生运动效果 ); <style> div { width: 100px; height: 100px; background: red; position: absolute; left: 0px; } </style> 基本的结构... »

IOS上iframe的滚动条失效的解决办法

问题描述:  iframe设置了高度(例如500px)。倘若iframe的内容足够长超出了iframe设定的高度时,在ipad等设备上。iframe内部html的滚动条不出现。并且活生生的从500px处截断,(类似overflow:hidden的效果)下面的内容不再显示。  问题重现: 结构:  index.html : <style>   #iframe... »

照片各部分的彩色与黑白交替更换

照片各部分的彩色与黑白交替更换

ul { width:300px; height:300px; margin:0px auto; padding:0px; overflow:hidden; background:transparent url(/study/2006_12_25/2006122516414543849.jpg)} li {list-style-type:none; width:100px; height:100p... »

javascript实现简易聊天室

聊天室是我们经常见的,比如微信聊天界面、QQ聊天界面等等,一个简易的聊天室如下: 1.html代码 <div class="content"> <div class="section"></div> <form action="#"> <textarea id="$value"></textarea> <button t... »

利用css制作3D照片墙效果

利用css制作3D照片墙,具体代码如下所示:无标题文档 以上代码是准备工作,在html代码的body主体中放了一个div,里面包着你想要显示在照片墙上的照片,数量可以任意。效果图总结以上所述是小编给大家介绍的利用css制作3D照片墙效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。 »

CSS background-position的使用说明详解

background-position的说明: 设置或检索对象的背景图像位置。必须先指定 background-image 属性。对应的脚本特性为 backgroundPosition 。等同于 background-position:0,0; 也等同于background-position:0%,0%; 二.background-position:right bottom;(见图2)。等同于ba... »

详解使用CSS3的@media来编写响应式的页面

CSS3 的 @media 查询定义和使用使用 @media 查询,你可以针对不同的屏幕大小定义不同的样式。@media 可以针对不同的屏幕尺寸设置不同的样式,特别是如果你需要设置设计响应式的页面,@media 是非常有用的。CSS 语法@media mediaType and|not|only 媒体类型类型有很多,在这里不一一列出来了,只列出了常用的几个。 »

js上下视差滚动简单实现代码

前言: 项目中让实现一个简单的上下视差滚动,就是当页面滑动到某一固定位置时,让上下两页面出现叠加效果,恢复时,展开恢复。 功能技术实现方式:元素定位,鼠标事件 思路1: 一开始想着设置滚动条监听事件,当到固定位置时下方元素设置relative属性(这样可保证不改变其原有样式而且可以实现元素位置的调整),于是就诞生出一下代码: <!DOCTYPE html> <html> &... »

js常用DOM方法详解

介绍几个js DOM的常用方法 获取元素节点 getElementById    getElementsByTagName    getElementsByClassName 先写一个简单的网页做测试: /*   test.html */ <!DOCTYPE html> <html> <head> &l... »

图片轮换效果实现代码(点击按钮停止执行)

在这个小程序中,需要把images文件夹下图片的命名设置为有顺序的,1、2、3…… »

js+html+css实现鼠标移动div实例

js: 代码如下: var posX; var posY; fdiv = document.getElementById(“divBody”); document.getElementById(“divHead”).onmousedown=function(e) { if(!e) e = window.event; //IE posX = e.cli... »

window.dialogArguments 使用说明

f1.php页面JS代码,第二个传的参数必须是self不能是别的 复制代码 代码如下: HTML代码 复制代码 代码如下: f2.php页面,parent.dialogArguments与window.dialogArguments效果一样,而且此处必须用getElementById,不能用getElementByName 复制代码 代码如下: »

解决jquery的.animate()函数在IE6下的问题

), 我是用.animate()去实现隐藏展开的,代码如下: 复制代码 代码如下: 无标题文档 123 123 如果这样子的话,在FF,IE7-8,chrome下执行是正常的。可是IE6下无法隐藏left,原因是因为ie6默认内容高宽度超出时,DIV会自动撑开。所以只要给.left加个overflow:hidden,问题也就解决~~ PS:本来早上是写个函数把.lef... »

锋利的jQuery 要点归纳(三) jQuery中的事件和动画(下:动画篇)

二、动画 1 show()方法和hide()方法 代码如下: $(“selector”).show() 从display:none还原元素默认或已设置的display属性 $(“selector”).hide() 设置元素的display样式为none,等于$(“selector”).css(“display... »

jquery 简单的图片展示效果

jquery练习——简单的图片结果展示效果–cnblogs libsource/ #cfoot ul,#cfoot li{ margin:0;padding:0;list-style-type:none; } #cdiv{ width:500px;height:500px;line-height:500px;text-align:center;border:1px solid #D5D... »

有关绝对定位的全面理解

有关绝对定位的理解/* 1.未被设置定位之前是大盒子包裹着小盒子,符合标准文档流,如图片1所示.box1.box2*/图片1/*2. 绝对定位使元素的位置与文档流无关,因此不占据空间。绝对定位的元素的位置相对于最近的已定位祖先元素,如果元素没有已定位的祖先元素,那么它的位置相对于最初的包含块。 »

CSS图片垂直居中方法整理集合 !(常见问题解答)

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> <style type=”text/css”> <!&... »

css 兼容性书写记录

从页面开始布局设计初就考虑到各个浏览器的问题,留出充足的余量和给各个浏览器留出充足的发挥空间,这样的页面兼容性才是最好的。   下面就来几个问题:   1、div border不能显示   问题描述:用一个div A层中间放了几个div B来存放内容,因为内容是不固定的,于是就使用了对B层使用了float,让A层自适应高度,后面对A层加上边框,在ie中能显示,但是在firefox中就始终没法显示。... »

css实现两栏固定中间自适应的方法

1、利用绝对定位和margin 此方法的原理说将左右两侧进行定位,让其脱离文档流。 中心区域自然流动到它们下面,再为其设置margin值 此方法页面元素结构可以顺序可以随意变动,注意top值需要进行处理,不然可能会出现对不齐现象 HTML <div id='container'> <div class='left'>左侧</div> <div class=... »

在这里插入图片描述

利用css制作3D照片墙效果

利用css制作3D照片墙,具体代码如下所示:无标题文档 以上代码是准备工作,在html代码的body主体中放了一个div,里面包着你想要显示在照片墙上的照片,数量可以任意。效果图总结以上所述是小编给大家介绍的利用css制作3D照片墙效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。 »

4种灵活的Scss编译输出风格整理

很多人从使用Scss的那一刻起,就被别人告诉了如何编译。所以,基本上也就只会一种命令编译方式。其实Scss提供了4种风格输出CSS,以满足更多人的需求。不同的输出方式如下: 嵌套输出方式 nested 展开输出方式 expanded 紧凑输出方式 compact 压缩输出方式 compressed 那么,以后就可以随意的使用参数来生成自己喜欢的CSS风格。 1、nested nested为嵌套输出... »