PC端静态网页开发项目指网页中主要内容所在的区域。一般在浏览器窗口中水平居中显示，从而让用户的视线更集中。常见的版心宽

一.开发基础

指网页中主要内容所在的区域。一般在浏览器窗口中水平居中显示，从而让用户的视线更集中。

常见的版心宽度值包括960px、980px、1000px、1200px等。

制作方法:使用标准流中的margin居中方法。

为了高网页制作的效率，布局时通常要遵守一定的布局流程，具体如下:

大部分网站在标签页标题位置会添加网站的icon图标。图标的文件名要求以favicon.ico命名，文件需要与index.html文件同级存储。使用方法，通过标签进行引用，设置的属性包括:

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">

css分级引入
- 清除默认样式的css，
- 网站的公共样式css，
- 每个页面自己独有的css.注意书写顺序，引入多层css时，需要按照后面的层叠前面的css进行设置，使用页面独有的样式层叠公共的样式。

使用范围:单独的一个HTML页面。
制作方法:找到页面独有的而其他页面没有的样式，单独书写在一个.css文件中，只有对应的HTML文件能够引用。
命名习惯:一般文件名与HTML的文件名保持一致，例如index.css，如果拆分的更细致可以使用多个单词的拼写，例如index_banner.css等。
引入顺序:在所有公共样式后面。
注意:使用单独样式文件去层叠前面公共样式时，需要注意选择器权重。

布局类型:通栏背景，内部包含居中的主要内容。
搜索框区域表单:需要添加标签,保证数据能够提交数据库。
补充:文本框<input>标签可以通过一个placeholder属性，设置默认提示文本，点击文本框输入文字后，placeholder属性的内容会自动消失。

content :网页的主要内容区域，用于展示更多的产品、信息等。
布局类型:通栏，底部设置边框,内容为版心居中。
content内部包括四个部分:.main主要区域列表焦点图、.hot_recruit热门职位、.hot_company 热门公司、.hot_links热门链接。

布局类型:左窄右宽的两列布局，通过浮动实现。
aside :侧边栏常用命名，整体为无序列表结构，表现为一种特殊的下拉菜单效果，鼠标移上<非后显示内部的子级元素。下拉菜单的列表中，推荐使用定义列表结构搭建。
注意:侧边栏aside这种结构中的数据是可能动态发生变化的，我们需要搭建好HTML结构和正确的css样式，让HTML结构足够清晰，方便后期后端开发人员传入数据
banner:焦点图部分为滚动轮播图效果，点击滚动特效待后期学完JavaScript后制作。
布局方式:整体使用定位制作，与淡入淡出轮播图不同的是图片所在无序列表中，图片需要浮动显示，而不是定位到同一点。特殊的需要添加魔术替换图片，方便后期JavaScript制作。

.word_cut {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

热门职位部分是一种tab选项卡结构，并且与后面的热门公司和热门链接有类似的结构和样式，需要谨慎提取公共样式，通过公共类名设置CSS，热门职位独有的样式需要使用单独的类名设置,避免影响其他两个部分。
布局类型:tab栏选项卡结构，整体为上下对齐的版心结构。
标题部分:浮动制作，当前展示的部分标签使用current的类名进行标记，设置特殊样式。详细内容布局类型:平均分步型，使用浮动制作。
补充:多余文字显示成...省略号形式，通过三行代码实现。

热门公司部分与热门职位结构类似。
本模块需要更改一些公共样式，注意使用新的类名进行覆盖，保证选择器的权重足够。
注意:链接内容部分涉及到后期JavaScript特效，鼠标点击显示和隐藏，需要提前将HTML结构和css样式书写完整，暂时设置为display : none