HTML代码就不展示了，重点展示一下实现导航栏固定的jQuery核心代码。

$(window).scroll(function(){

if($(window).scrollTop()>100){

$(".nav").addClass("fixed");

}else{

我们常说的DIV+CSS网站其实是一种网页的布局方法，这一种网页布局方法有别于传统的HTML网页设计语言中的表格table定位方式，可实现网页页面内容与表现相分离。使用这种布局的网站可以给用户带来更多方便和视觉上的体验。

小编在下面的内容中将自己总结的经验，关于DIV+CSS的一些优势所在介绍给大家，希望各位朋友认真阅读，以便日后可以随时掌握这种布局的方法。

1.网站加载的速度更快

我们将网页写在CSS里面后，这样网站的体积容量变得就会更小，DIV+CSS将页面独立成更多的区域，在打开页面的时候逐层加载。

网站建设中掌握基于CSS的网页布局方式，是实现web标准的基础。网站建设在主页制作时采用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其他效果实现更加精确地控制。只要对相应的代码做一些简单的修改，就可以改变网页的外观和格式。网站建设时采用CSS布局有以下优点。

1. 大大缩减页面代码，提高页面浏览速度，缩减带宽成本

2. 结构清晰，容易被搜索引擎搜索到。

什么是DIV+CSS

DIV+CSS是WEB设计标准，它是一种网页的布局方法。与传统中通过表格（table）布局定位的方式不同，它可以实现网页页面内容与表现相分离。提起DIV+CSS组合，还要从XHTML说起。XHTML是一种在HTML（标准通用标记语言的子集）基础上优化和改进的新语言，目的是基于XML应用与强大的数据转换能力，适应未来网络应用更多的需求。

“DIV+CSS”其实是错误的叫法，而标准的叫法应是XHTML+CSS。因为DIV与Table都是XHTML或HTML语言中的一个标记，而CSS只是一种表现形式。也许其提出者本意并没有错，但是跟风者从表现曲解了其意思，认为整个页面就应当是DIV+CSS文件的组合。

前言

曾几何时，前端的页面布局一直采用div，但是div本身并没有实际的意义，它只是定义了一个区域，而且这个区域是做什么的浏览器并不知道，不利于页面的SEO优化。

因此HTML5中新增的语义化标签就很好的解决了这个问题，当然它还有其他一些好处，接下来我们就一起来看看吧。

HTML5

语义化标签的优点

今天在写一个关于 html 中 select 下拉元素选择的动态事件时，发现如果使用 javascript 中的 click 事件的话，会被执行两次。网上查了一下资料，发现 select 元素下拉选中事件并不适合使用 click 来触发，而要使用 change 事件。

select元素下拉的click事件

html代码

<select name="mochu" id="mochu">
 <option value="1">下拉1</option>
 <option value="2">下拉2</option>
 <option value="3">下拉3</option>
 <option value="4">下拉4</option>
</select>
<script>
 $('#mochu').click(function(){
 console.log($(this).val());
 });
</script>

最近，小编正在开发一个基于net core2的CMS，命名为：NetCoreTFCMS。在开发过程中经常会使用到下拉列表，觉得在View中要动态交互数据比较麻烦，就想着自己写一个tagHerlper来将enum快速生成下拉列表。

下面，我就从一个具体实例来抛砖引玉下：

会员列表页-会员状态下拉列表

1.首先定义一个文章状态的enum类型，且叫UserStatus吧。