编程记录，亲测有效

notepad++是一款很好的前端网页开放工具，甚至许多人也用其开放php，但是NotePad++会默认记录上次打开时未关闭的文件，实际上用起来并不方便，可以按照下面的方式去除：设置->首选项->备份->将Remember current session for next launch前面的勾选去掉，然后点击关闭并重启即可。如图：

在《【CSS】禁止Google浏览器允许定义调整多行文本框》（点击打开链接）中已经提及过如何使多行文本框Textarea在一些DOM2的浏览器中固定下来。这不，多行文本框Textarea在IE中也存在一些样式上的缺陷了。一个普通的，没有加任何定义的文本框，如下：其在IE的效果就如同左侧一样，在没有输入任何文字，就出现垂直滚动条很不雅观，尤其是在一些不打算给用户输入过多文本的情况下

如下图：这种高大上的布局看起来仿佛只有那些前端框架，而且要考虑很多东西才能够弄出来。其实不然，完全可以自己手写几句简单的CSS就能够弄出来了。根本无需理会那些动不动就摆大牌说不兼容IE6就不兼容IE6的前端框架。先上代码再讲解。上图的代码如下： 卡片式布局 body{ background:#eeeee

看到这个标题，肯定有人说，HTML的空格不是 吗？还可以开一篇文章专门来写这东西浪费流量浪费电？或者是UP主发牢骚写的感情文字？我当初也是认为的HTML的空格就是 的代名词。然而，如果只知道HTML中， 代表空格，那实在是太年轻了。在HTML中还有两个可以表示空格的符号，一个是 ，另一个是 而且 ，较之制表符TAB，&nbsp

在《【CSS】兼容IE6的卡片式布局》（点击打开链接）已经介绍过如果用CSS画出一块一块的卡片，现在介绍如何为这些卡片添砖加瓦，为这些卡片的加上标题。如下图所示，这是在现在部分网站很常用的两种标题：先是在IE8的效果之后是在IE7的效果：都是没有什么问题的，最后是在IE6的效果，第一种这种嵌入式标签的标题，有部分问题，但不影响显示。貌似是因为IE6不支持margin

!important、*、_其实没什么用，皆是用来设置样式的优先级，但是样式的优先级你可以自行排好其先后位置来设置，然而你还是要看懂的。我们知道，CSS写在不同的地方有不同的优先级， .css文件中的定义 首先，先看下面一段代码： !Important 呵呵 “呵呵”两字被定义了两个color，原本在col

单行图片与文字垂直居中核心关键，是在img标签中的style属性加入vertical-align:middle;样式如果不设置的话，单行图片与文字并排的话，文字默认是底部居中的。注意如下的代码的img标签，没有设置任何的style属性， img 11111111111 222222222

上次在《【jQuery】兼容IE6的滚动监听》（点击打开链接）提及到解决IE6fixed问题，具体是要引入一个js文件，还要声明一条脚本就为这个div声明fixed定位去解决，起始这样很不好啊。引入的Javascript不好管理之余，还要在head声明引入javascript，之后又要给这个div声明一个id，之后又要在脚本出弄一条声明，实在是烦死了。使用position：fixed无非是想做

position有5个属性，其中position:inhert，规定div从父元素继承position属性的值，这个没什么好讲的。其次就是position:static，这个虽然我们很少写，但是此乃HTML的默认值，没有定位，元素出现在正常的流中（忽略top,bottom,left,right或者 z-index 声明），position:static区别于position:inhert不从父元素

a标签，也就是超级链接，的样式问题，主要包括如果设置鼠标悬停到a标签上后变成手形的问题与a标签去掉下划线的问题。虽然很简单，但是经常忘记。一、a标签的手型问题如何让鼠标悬停到a标签上后变成手形？a { cursor:pointer;}a标签去掉手型则是：a { cursor:default;}二、去掉a标签的下划线正常状态下的a标签是有下划线的，使用如下

padding,border,margin这三样东西不算难，算是在CSS中老生常谈的东西，但是要注意其对width的影响，直接上一段极其简单的代码： margin_border_padding_and_width Div的实际宽度：px Div的含边线的宽度：px ssssssssss

没有jQuery与javascript等脚本，直接在HTML代码中，也是可以，要求不同的浏览器执行不同的HTML代码。这里利用到IE注释。比如如下代码： 根据条件判断，这是版本小于等于7的Internet Explorer 根据条件判断，这是版本大于7的Internet Explorer -->

在这段HTML代码中，分两部分，第一部分，在一个表单中设置4个按钮，第一个按钮，自然是无可争议，也是大家最常用的submit按钮，这个按钮学过网页编程都知道是用来提交表单的，但大家知不知道，随后3个按钮，哪个按钮能够提交表单呢？当然，答案在上面的HTML代码中已经写明白了，如果你设置的按钮，要做一些点击的Javascript(jQuery)动作或者完成一个Ajax的话，而不是提交表单的话，请用规范的<input type="button" onclick="某某javascript函数">的形式，而不是<b

其实菊花文、边框文和喷射尾巴已经火了很长的一段时间了，你肯定见过如下效果：人҉҉要҉҉是҉҉撸҉҉多҉҉了҉҉҉҉连҉҉看҉҉东҉҉西҉҉眼҉҉都҉҉是҉҉花҉҉的҉҉...（菊花文）这只是个神奇的小尾巴，请不要试图去研究我是怎么发出来的：ฏ๎๎๎๎๎๎๎๎๎ฏ๎ฏด้้้้้็็็็็้้้้้็็็็็้้้้้็็็้็็็ฏ๎็็็็็็oด้้้้้็็็็็้้้้้็็็็็

面板这东西，随着前端框架的逐渐流行，已经大量地占据网页封面了。其实这东西可以用纯粹CSS的方式写出来了。比如如下面板：其代码如下：panel 面板标题 面板内容…… 其构造很简单的，一个为灰色外框的div里面镶嵌两个div。一个是面板标题的div，这个div无须设置高度，让其自适应

一个正常的前端攻城狮，一般情况不会把内容布置到div外面，但是如果这部分的内容，是用户输入的，然后是从数据库中取出来的，那样有内容超出div部分也是很正常的，尤其是这部分内容，是用户通过编辑器编辑的，便有可能出现这样的情况：比如，限制一个宽350px，高100px的表格，用户用编辑器设置了一个400px x 400px的表格，就会溢出。

标签能够添加一条水平分隔线微软这个家伙在最新的IE8下已经放弃对MARQUEE的支持了（我这里很无语，MARQUEE是微软自己创造出来的，现在火狐都支持了，它自己不干了）用marquee有诸多问题的。DW给你提示是警告你慎重。

如下的页面很简单，刚刚学习过HTMLbi

div布局之所以要学懂学透，是因为table的布局实在是难堪大用，如果是同处于一个表格之内，各行的规格分布根本就没法调，例如下面的一段非常简单的代码：无标题文档111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111

按理说，右键新建一个文本文档，并且把“新建文本文档.txt”改名成"1.html"，然后再于里面写入：中文是一点问题没都没有了的，可是，部分浏览器打开这个1.html却发现乱码，或者里面的表单传递值的时候发现，你为了不乱码，你就在标签中加入毕竟网上都是这样说，这样在大多数情况也没有问题的，可是，如果你用notepad++打开这文件往里面一加这句话如果你会发现

JavaScript被某些程序员简称为JS，两者是同一回事，下同，不

本文的创作想法是从《【Bootstrap】一个兼容IE8、谷歌等主流浏览器的受众门户式风格页面》（点击打开链接）与《【CSS】扁平化，支持IE6的含有方块超级链接的导航栏与含有支持IE8的下拉菜单的导航栏》（点击打开链接）两篇文章，改进而来的，Bootstrap虽好，但是不兼容IE6始终是一块心病，虽然有bsie6插件，但是这插件也不是对于所有组件的使用的，万一出现不兼容IE6问题，你改都不知道怎

没有写过英文版的网页不知道，写过也未必知道，在网页中，把英文放在div里面的话，div对于长单词，采用优先原则，允许英语长单词超出我这个div的宽度，比如如下的代码：I am a looooooooooooooooooooooooooooooooooooooooong word!本来我设置了这个图层的宽度是100px，希望里面的所有东西，遇到边界自动换行，即得到如下

在网页中，如果需要left与top属性生效，就必须为这个div的style属性加入position:absolute，这样，此div才能游离于整体的div布局之外，也就是说，你没有加position:absolute之前，所有的div遵循我在《【CSS】关于div的对齐与网页布局》（点击打开链接）所提到的，各种各样布局。例如下面的代码：就得到如下的效果：如果把posit

Bootstrap确实是一个好的前端框架，但是这东西就是任性，只支持IE8以上的浏览器，国外还有一些其他不错的框架，但是连WIN7默认的浏览器IE8都不支持，那留你何用，甚至Bootstrap这一优秀的框架在其V4版本也矫情起来了，开始不支持IE8，把我大天朝的IE6放哪里去？扁平化总是给人高大上的样子，好像必须用前端框架实现不可，自己写前来根本无从下手，其实根本不是，都是CS

上次在《【Bootstrap】导航栏navbar在IE8上的缺陷与解决方案》（点击打开链接）给大家推荐过导航栏怎么写，这次不用任何框架，纯手写CSS，原生态，方便各位改写！请笑纳。一、首先是含有方块超级链接的导航栏，如下图：这个东西个人觉得拼接在一些灰色巨幕下面做首页的导航栏不错或者放在一些标签页上面也是可以的代码如下：按钮1按钮2首先你要定义一个大div

大家都知道在HTML利用使用注释是，长期以来大家都这样用，但是这段注释可以在源代码中被查看。虽然HTML页面已经提前约定自己写的HTML代码被公开，前端终归是前端，前端代码不值钱之类的，但是，这些关于HTML注释直接放在源代码能够被查看中始终有种不规范的感觉，而且这段注释分明就可以利用一些技巧隐藏起来。如果是JSP页面大家不妨使用，来注释，比如以下页面：<%@ page langu

上次在《【CSS】扁平化都是纸老虎，看怎么抛弃前端框架在IE6扁平化》已经提及到扁平化按钮在IE6的实现方案，现在我再给出一种在IE8实现按钮扁平化的悬停的解决方法。悬停属性只能支持到IE8了，IE6它丫不支持我也没有办法了。这种方法我觉得自己的优点是，代码量就5行，然后，由于是纯手写的CSS，兼容绝大部分的浏览器，加载速度也快。具体效果如下图：基本做到比较好的效果。手写CSS高仿Bo

众所周知，多行文本框Textarea是不可以自己随便调整的，如下图，如果要调整，则要写很多的脚本：这个也好，因为很多情况下，我们不需要开放给用户调整文本框，往往只是需要设置col与row属性，固定其大小就可以的。可是，谷歌浏览器，对于，一个普通的：却是可以如下图，轻易调整的：这样会拖乱我们页面布局的，有时候调试不知道怎么回事，还以为样式没有写好，你可以认为这

前端开发到底用什么工具去写代码。一直众所纷纭。首先是早已被抛到角落的FrontPage之后是现在已经渐渐被抛到角落的Dreamweaver，很多大神主张前端这么简单就应该直接用记事本去写，然后觉得记事本太蛋疼，改用NotePad，Sublime Text 2之类的，其实还有一款不错的前端开发IDE——Aptana Studio。虽然我之前一直在用Dreamweaver的代码视图写前端……以前则是用

这本来是个在word里面才有的概念，但人家就是要我们程序猿在网页中实现。在一般情况下，比如如下的代码：