“html js”目录存档
CSS 常用属性中文解释
2012年02月6日,星期一
CSS 背景属性(Background)
background
在一个声明中设置所有的背景属性。
background-attachment 设置背景图像是否固定或者随着页面的其余部分滚动。
background-color 设置元素的背景颜色。
background-image 设置元素的背景图像。
background-position 设置背景图像的开始位置。
background-repeat 设置是否及如何重复背景图像。
CSS 字体属性(Font)
font 在一个声明中设置所有字体属性。
font-family 规定文本的字体系列。
font-size 规定文本的字体尺寸。
font-size-adjust为元素规定 aspect 值。
font-stretch 收缩或拉伸当前的字体系列。
font-style 规定文本的字体样式。
font-variant 规定文本的字体样式。
font-weight 规定字体的粗细。
CSS 外边距属性(Margin)
margin 在一个声明中设置所有外边距属性。
margin-bottom 设置元素的下外边距。
margin-le···
php连接mysql网页乱码解决办法与原因
2012年02月6日,星期一
php连接mysql文件乱码原因分析
1、mysql数据库默认的编码是utf8,如果这种编码与你的PHP网页不一致,可能就会造成MYSQL乱码.
2、MYSQL中创建表时会让你选择一种编码,如果这种编码与你的网页编码不一致,也可能造成MYSQL乱码.
3、MYSQL创建表时添加字段是可以选择编码的,如果这种编码与你的网页编码不一致,也可能造成MYSQL乱码.
4、用户提交页面的编码与显示数据的页面编码不一致,就肯定会造成PHP页面乱码.
5、如用户输入资料的页面是big5码, 显示用户输入的页面却是gb2312,这种100%会造成PHP页面乱码.
5、PHP页面字符集不正确.
7、PHP连接MYSQL数据库语句指定的编码不正确.
一。首先是PHP网页的编码
1. php文件本身的编码与网页的编码应匹配
a. 如果欲使用gb2312编码,那么php要输出头:header(“Content-Type: text/html; charset=gb2312″),静态页面添加<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″>,所有文件的编码格式为AN···
在IE下使用Firebug的简单功能
2012年02月6日,星期一
朋友推荐了我一个web版firebug,适用大多数浏览器,确实不出,主要可以用于IE的CSS样式调试,因为IE developer toolbar和IE8自带的调试工具太难用了。
在网页head 部分上面 这个JS 即可使用web版firebug:
“ <script type=”text/javascript” src=”https://getfirebug.com/firebug-lite.js”></script> ”
如果想查看在线的页面元素,版主给了如下方法:
1
<a href="javascript:(function(){var d=document, s=d.getElementById('firebug-lite');if(s!=null)return;s=d.createElement('script');s.type='text/javascript';s.src='https://getfirebug.com/firebug-lite.js';d.body.appendChild(s);})();void(0);">firebug-lite</a>
运行上面的HTML代码,在 “firebug-lite” 的连接上点右键选择“添加到收藏夹”(这个应该针对IE,chrome右键没有加入收藏),把这个连接添加到收藏夹。然后打开任意一个网页,打开后,在收 藏夹···
Chrome扩展:Run Selected HTML
2012年02月6日,星期一
向大家推荐丸子开发的Chrome扩展:Run Selected HTML
这个扩展对于平常爱学习的同学还是比较有用的,至少我是这样感觉的哈哈,安装完扩展后,当你在阅读一些前端技术博客的时候,就可以选中页面上的html代码,然后右键点“Run Selected Code”就可以查看代码效果啦。
< !DOCTYPE html>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>测试一下下</title>
</head>
<body>
<h1>测试扩展</h1>
<div>安装完扩展,请选中这段html代码,然后右键点击“Run Selected Code”查看效果</div>
</body>
</html>
有任何bug或者建议,欢迎留言反馈。如果觉得工具挺方便麻烦+1或好评哦
run-selected-code
jQuery无限级下拉菜单插件-jMenu
2012年01月28日,星期六
给力技术之前也推荐过几个下拉导航菜单的插件,今天这篇文章要推荐一个jQuery无限级下拉菜单的插件jMenu。
jMenu是一个简单的轻量级水平下拉菜单插件,你可以使用嵌套的UI列表来创建无限级的菜单。它拥有很平滑的移动效果,菜单样式也可以自定义修改,定制性很高。
如何使用
首先要加载jQuery库和jMenu插件以及相关的CSS样式
<script src=”jquery.min.js” type=”text/javascript”></script>
<script type=”text/javascript” src=”jMenu.jquery.js”></script>
然后在HTML页面中创建UL列表,并设置第一级列表的class=”fNiv”
<ul id=”jMenu”>
<li><a class=”fNiv”>菜单 1</a></li>
<li><a class=”fNiv”>菜单 2</a>
<ul>
<li class=”arrow”></li>
<li><a>菜单 2.1</a></li>
</ul>
</l···
Javascript实现最新文章显示New图标
2011年11月14日,星期一
以下代码保存为html即可看到效果
<html>
<head><title>www.onbno.com Javascript实现最新文章显示New标志</title>
<style type="text/css">
ul{list-style:none;}
ul li{line-height:26px;}
ul li i{margin-left:10px;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
function ShowListLatestIcon(latestnum){
// 获取全部包含class的值为'showlatesticon'的ul列表
var leftnewslist = jQuery("ul.showlatesticon").find("li");
// 要插入到列表条目中的图片标志
var latestimg=" <img src='new.png' width='24' height='24' border='0' />";
if(leftnewslist.length>0){
var j=0;
// 遍历li列表,前latestnum个显示new图标
jQuery.each(l···
使用WORDPRESS缩略图功能
2011年11月1日,星期二
wordpress2.9+内置缩略图功能。是的,你可以直接通过wordpress上传图片制作成缩略图,但是它不仅仅可以做出缩略图,你甚至可以控制缩略图的大小。
在本教程中,我将会涉及到很多关于缩略图的事情。有些是给普通的用户,也有的是写给正在制作开发wordpress主题或者插件的朋友。
有件事情很有必要在之前强调,就是缩略图是和文章绑定在一起,他们之间是不可以没有关系的。
普通用户想使用缩略图怎么办
首先,你所使用的wordpress主题必须支持该功能,否则,你将不可能使用这个功能。这里我们先假设你的主题支持这个功能,至于如果给主题添加这个功能将在后面的教程中提到。
要使用这个功能,你必须登录后台,然后确定你已经来到了文章编辑页面,在屏幕的右下方你会看到一个叫做“Post thumbnail”或者“Page thumbnail”(注:中文3.0以后的显示的是特色图片)
那里你会看到“Set thumbnail,”的按钮(注:中文3.0以后的显示的是添加特色图片),它能让你通过媒体上···
图片IMG垂直居中
2011年10月27日,星期四
要想让图片和文字垂直居中对齐的话,可以在IMG标签下添加align=absmiddle属性即可实现,但align=absmiddle属性在W3C验证下通不过[验证地址请查看W3C网页标准验证服务地址],那么是否可以用CSS来代替IMG的align=absmiddle属性来实现垂直居中呢,答案是肯定的。
可以在CSS中加入vertical-align:middle;就能实现了
<div><img style="vertical-align:middle;" src="Redmond/close_32.png" />用CSS实现图片和文字垂直居中对齐</div><br /><br />
<div><img src="Redmond/close_32.png" />这个是没加样式的效果</div><br /><br />
<div><img align=absmiddle src="close_32.png" />这个是用align=absmiddle实现图片和文字垂直居中对齐</div>
jquery 写的图片左右连续滚动
2011年10月24日,星期一
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="zh-CN">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>
网络蛀虫小窝
兼容ie的滚动图片jquery代码</title>
<style type="text/css">
*{ margin:0; padding:0;}
body { font:12px/1.8 Arial; color:#666;}
h1.tit-h1 { font-size:38px; text-align:center; margin:30px 0 15px; color:#f60;}
.go-back{ text-align:center; border-top:1px dashed #ccc; padding:10px; margin-top:20px; font-size:40px;}
.wrap{border:1px dashed #ccc; background:#f8f8f8; padding:20px;}
#slide{overflow:hidden;width:900px;margin:100px auto;}
···
jquery下拉菜单的代码
2011年10月20日,星期四
html 代码
<div id=”menu”>
<ul>
<li><a href=”">菜单一</a>
<ul>
<li><a href=”">子菜单1</a></li>
<li><a href=”">子菜单2</a>
<ul><li><a href=”">子菜单7</a></li></ul>
</li>
<li><a href=”">子菜单3</a></li>
</ul>
</li>
<li><a href=”">菜单二</a>
<ul>
<li><a href=”">子菜单4</a></li>
<li><a href=”">子菜单5</a></li>
<li><a href=”">子菜单6</a></li>
</ul>
</li>
</ul>
</div>
css代码
ul,ol,li{list-style:none;padding:0px;margin:0px;}
#menu *{line-height:30px;}
#menu a{
text-decoration:none;
display:block;
}
#menu ul{
text-al···