随笔分类 - Div\CSS\Html

摘要:我们先来看看CSS3 Api中对position属性的相关定义: static:无特殊定位,对象遵循正常文档流。top,right,bottom,left等属性不会被应用。 relative:对象遵循正常文档流,但将依据top,right,bottom,left等属性在正常文档流中偏移位置。而其层叠 阅读全文
posted @ 2017-09-08 17:08 chinaifne 阅读 (31) | 评论 (0) 编辑
摘要:积累了一些经验,总结出一些关于div的高度自适应的技巧,希望有助于大家,转载请标明出处,谢谢。一、高度的自适应(父div高度随子div的高度改变而改变)1、如果父div不定义height、子div均为标准流的时候,父div的height随内容的变化而变化,实现父div高度随子div的高度改变而改变。... 阅读全文
posted @ 2014-11-02 11:42 chinaifne 阅读 (228) | 评论 (0) 编辑
摘要:让DIV高度自适应,这是在网页设计中常遇到的问题,为了给大家提供参考,这里提供3种div高度自适应的方法:一是JS法、二是背景图填充法、三是“补丁大法”(比较变态)。1、JS法代码如下。原理:用JS判断左右DIV的高度,若不一致则设为一致。view sourceprint?01 02left 03 ... 阅读全文
posted @ 2014-06-29 00:18 chinaifne 阅读 (79) | 评论 (0) 编辑
摘要:本代码通过测试说明:一级栏目表。这里是硬编码在文件中了。二级栏目表ablum,里面有员工的信息:姓名(albuj_name),id(album_id),所属部门id(type_id)<%@ include file="../data.jsp" %><%@ page contentType="text/html;charset=gb2312" %><% request.... 阅读全文
posted @ 2010-10-12 17:59 chinaifne 阅读 (7439) | 评论 (0) 编辑
摘要:JavaScript对下拉菜单的基本操作:1.获取一个下拉菜单对象Js代码 var select = document.getElementById("selectid"); 2.在下拉菜单中添加一个选项Js代码 var option = new Option("value","text");//第一项为值,第二项为文本域 3.把选项加入到下拉菜单中Js代码 select.options.add(... 阅读全文
posted @ 2010-10-12 06:20 chinaifne 阅读 (10030) | 评论 (0) 编辑
摘要:有如下需求,需要控制一个table内几个tr的显示问题。一开始想的方法是在这几个要显示的tr外面套一个div,利用div的display:none属性来解决。 但是后来发现div和tr嵌套的时候会有问题。例如,如果我的html页面是这样的源码:view plaincopy to clipboardprint?<html><head> </head> <bo... 阅读全文
posted @ 2010-10-11 23:32 chinaifne 阅读 (8623) | 评论 (3) 编辑
摘要:<style>#chaptertree li{float:left;width:40%;margin:1px;padding:0;}</style><div id="chaptertree"> <li><a > 六种不同风格的时间</a></li> <li><a > 带颜色的滚动条</... 阅读全文
posted @ 2010-09-30 18:04 chinaifne 阅读 (790) | 评论 (0) 编辑
摘要://过滤html,输入参数: //html:要转换的数据字符串,filter:要过滤掉的单个格式 function DecodeFilter(html, filter) { switch(filter.toUpperCase()) { case "SCRIPT": // 去除所有客户端脚本javascipt,vbscript//过滤html,输入参数://html:要转换的数据字符串,filter... 阅读全文
posted @ 2010-09-29 18:51 chinaifne 阅读 (209) | 评论 (0) 编辑
摘要:document.form.action,表单分向提交,javascript提交表单同一个表单可以根据用户的选择,提交给不同的后台处理程序。即,表单的分向提交。如,在编写论坛程序时,如果我们希望实现用户在发送贴子的时候,既发送提交功能又有预览功能时,就会遇到上述问题。即,当用户点击提交按钮时,我们希望表单提交给"提交"处理程序;而当用户点击预览按钮时,我们希望表单提交给"预览"处理程序。那么,如何... 阅读全文
posted @ 2010-09-27 15:00 chinaifne 阅读 (23526) | 评论 (2) 编辑
摘要:<script>var ye=1;function window.onload(){if(window.name=="" || window.name==null){window.name=ye;}else{window.name++;}aa.innerText=window.name;}</script><span id=aa></span>每刷新... 阅读全文
posted @ 2010-09-26 08:45 chinaifne 阅读 (2456) | 评论 (1) 编辑
摘要:<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title></head><body> <form method="post" action="Default.aspx" onsubmit="return check(th... 阅读全文
posted @ 2010-09-25 14:41 chinaifne 阅读 (1706) | 评论 (0) 编辑
摘要:*.location.href 用法:  top.location.href=”url” 在顶层页面打开url(跳出框架)  self.location.href=”url” 仅在本页面打开url地址  parent.location.href=”url”   在父窗口打开Url地址  this.location.href=&... 阅读全文
posted @ 2010-09-20 07:44 chinaifne 阅读 (76956) | 评论 (1) 编辑
摘要:一,用CSS使DIV层水平居中对需要水平居中的DIV层添加以下属性: margin-left: auto; margin-right: auto; 这样在FF中已经居中了,可是在IE中看还是没有居中!问题并不在CSS而在XHTML网页本身.需要加上这样的代码才能使得上述设置有效果: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitio... 阅读全文
posted @ 2010-09-08 18:02 chinaifne 阅读 (140) | 评论 (0) 编辑
摘要:先谈谈!important问题的引起(盒模型问题):  在CSS标准中,一个盒模型包括4个区,分别是:内容、内边距(padding)、边框(border) 和外边距(margin)。而Width宽度的计算,CSS有它的标准。但是实际上,不同的浏览器的表现却不同。比如,  Firefox(FF)是准确按照CSS标准:width为内容的宽度,也就是说:    层的宽度 = width + paddin... 阅读全文
posted @ 2010-09-08 10:29 chinaifne 阅读 (381) | 评论 (0) 编辑
摘要:1.ie8下兼容问题,这个最好处理,转化成ie7兼容就可以。在头部加如下一段代码,然后只要在IE7下兼容了,IE8下面也就兼容了<meta http-equiv="x-ua-compatible" content="ie=7" />2.flaot浮动造成IE6下面双倍边距问题,这个最常见,也最好处理,!important解决,比如margin-left:10px !important;... 阅读全文
posted @ 2010-09-08 10:27 chinaifne 阅读 (95) | 评论 (0) 编辑
摘要:IE6里DIV错位的问题 采用”FLOAT:LEFT“的DIV在IE8、IE7、都没问题,IE6下却向下移动,出现空白。这是因为,IE6采用的内核默认把DIV之间的距离增加了3~5个PX,所以,试试是将下移的DIV的STYLE里增加"margin-left:-5px;"或者更小。解决IE7、IE8样式不兼容问题方法一、要在页面中加入如下HTTP meta-tag: <... 阅读全文
posted @ 2010-09-08 10:24 chinaifne 阅读 (18247) | 评论 (4) 编辑
摘要:第二电脑网导读:TD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head><title>Div Float Sample</title><style type="text/css">div { margin:3px; }.d1 { wi... 阅读全文
posted @ 2010-09-08 10:22 chinaifne 阅读 (80) | 评论 (0) 编辑
摘要:所有浏览器 通用 (市面上主要用到的IE6 IE7 FF)height: 100px; IE6 专用 _height: 100px; IE6 专用 *height: 100px; IE7 专用 *+height: 100px; IE7、FF 共用 height: 100px !important;一、CSS 兼容 以下两种方法几乎能解决现今所有兼容. 1, !important (不是很推荐,用下... 阅读全文
posted @ 2010-09-08 10:19 chinaifne 阅读 (87) | 评论 (0) 编辑
摘要:1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了。缺点是要控制内容不要换行 2. margin加倍的问题 设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。解决方案是在这个div里面加上display:inline; 3.浮动ie产生的双倍距... 阅读全文
posted @ 2010-09-08 10:15 chinaifne 阅读 (85) | 评论 (0) 编辑
摘要:制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置。下面的教程总结了Javascript在网页定位方面的相关知识。一、网页的大小和浏览器窗口的大小首先,要明确两个基本概念。一张网页的全部面积,就是它的大小。通常情况下,网页的大小由内容和CSS样式表决定。浏览器窗口的大小,则是指在浏览器窗口中看到的那部分网页面积,又叫做viewport(视口)。很显然,如果网页的内容能够在浏览器窗口中全部... 阅读全文
posted @ 2010-06-27 10:02 chinaifne 阅读 (196) | 评论 (0) 编辑
摘要:position的四个属性值: relative ,absolute ,fixed,static 下面分别讲述这四个属性,以简单代码表示<div id="parent"> <div id="sub1">sub1</id> <div id="sub2">sub2</id></div>1. relativerelative属性相对... 阅读全文
posted @ 2010-06-26 23:52 chinaifne 阅读 (15989) | 评论 (6) 编辑
摘要:The DOM is separated into different parts (Core, XML, and HTML) and different levels (DOM Level 1/2/3): DOM被分为不同的部分(核心,XML和HTML)和不同的版本(DOM 1/2/3) The HTML DOM views HTML documents as a tree structure ... 阅读全文
posted @ 2008-07-12 17:43 chinaifne 阅读 (2404) | 评论 (0) 编辑