随笔分类 - XHTML+CSS
美工样式
摘要：在页面中，设置三个不同名称的选项卡，当点击选显卡的时候，下面对应的区域显示器内容信息，同时选项卡的背景色与内容信息的背景色浑然一体，并且字体加粗，表示处于选中状态。以下为实现代码：<!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"><
阅读全文
摘要：最近弄网站的新闻模块，新闻的列表用到了ul列表。为每个li添加了background，然后添加hover事件：background改变。代码如下：HTML code<li> <a href="news_show<? echo $row['id'];?>.html" class="news_tit"><?php echo $row['news_title']; ?></a> <span><?php echo $row['news_time&
阅读全文
摘要：今天在写一个购物车里面选择发货地址的部分时，多个收货地址用到了UL标签，由于每个地址的后面有个“修改地址”的功能，而且位于li标签的右边，于是就用到了，position：absolute； right：10px；这样把“修改地址”移到右边去了，不过在此之前需要在li标签添加position：relative才行。html如下：<ul class="addr_list"> <li class="on"><span>寄送至</span><input type="radio" name=
阅读全文
摘要：曾经在项目中遇到用到position：fixed的时候再IE6中不能兼容的状态，于是只能用到了虚拟的virtual_body，这个virtual_body其实就是一个div，控制div的宽高为页面的宽高，即为100%，设置这个div的css：.virtual_body{ overflow:scroll; width:100%; height:100%; position:relative;} 不过在此之前要设置此页面的body&html为：body,html{ overflow:hidden; width:100%; height:100%; margin:0; position:re
阅读全文
摘要：在一般情况下，用户提交表单后，将会跳转到另一个页面，同时表单中的内容也会清空。而有时为了简化操作步骤，需要保留历史信息，即当用户再返回原来页面时，还可以看到刚才所填写的信息。以下实例，当用户刷新或者单击“确定”按钮提交表单后再退回到原来页面时，文本框中的内容将保持不变。如下图所示：本实例主要是通过在css样式定义中，设置behavior确定对象的行为，并设置<meta>元信息标记中的name属性和content属性来实现保留历史信息的功能。<meta>标记是用来在HTML文件中模拟HTTP协议的响应头报文，是实现元数据的主要标记，它可以用于鉴别作者、标注内容提要和关键字
阅读全文
摘要：对于网络应用程序或者网站来说，安全最为重要。其中密码域的安全也非常重要。虽然在密码域中已经将输入的字符一掩码形式显示，但是他并没有真正实现保密，因为用户可以通过复制该密码域中的内容，并将复制的密码粘贴到其他文档中，查看到密码。为实现密码的真正安全，可以将密码域的复制功能屏蔽，同时改变密码域的掩码符号。通过控制密码域的oncopy、oncut、onpaste事件来实现密码域的内容禁止复制的功能，兵通过改变去style样式属性来实现改变密码域中的掩码样式。（1）在页面中添加密码域，代码如下：<input name="txt_passwd" type="passw
阅读全文
摘要：在制作网页时，如果信息分类的内容很多，还可以在下拉列表中将其分级显示，是用户更加清晰的查看选项。以下实例，可以看到下拉列表中的选项是分级显示的。程序运行结果如图所示。本实例主要是应用optgrounp标记，并设置其label属性。optgroup标记主要用于对select元素中的选项进行逻辑分组，在optgroup标记中指定的文本是非可选项，一般通过替换文本域可以选项区分开来。实现分级下拉列表的关键代码如下：<form id="form1" name="form1" method="post" action="&quo
阅读全文
摘要：1、新建一个元素，随便什么元素，不过我习惯性的会用块元素来做。如果行内元素就display:block它。 <div class="triangle"></div> 2、把它的宽高设置为height:0px; width:0px; 3、设置边框border属性，用来实现三角形。 首先要了解border具体是怎么样的，我写了一个这样的样式： border:50px solid #000; border-color:#f00 #000 #f0f #00f; 在FF下面显示效果如下：出现4个三角形合并成一个正方形。到这里就很清晰了，只要把想要的保留，其它的
阅读全文