HTML常用模板:用DIV实现网站首页、后台管理首页(整理)

news/2024/5/20 23:53:54/文章来源:https://blog.csdn.net/weixin_33713503/article/details/85581851

1. 说明

网上下载的模板,用DIV实现页面模块之间的分隔(不是用frameset/frame)。可以选择有无header/menu/footer,主体如何等等。删除了几个我认为重复的。重新命名而已。这样看文件夹就知道该目录是何种风格的模板。

附件中的文件夹命名规则:

  • l-表示左边有内容
  • r-表示右边有内容
  • h-表示有Head(头部,一般用于网站的Banner)
  • m-表示有Menu(菜单,一般用于功能选项)
  • b-表示有Body(主体,网站主体)
  • f-表示有Footer(底部,版本信息类)
  • bx-表示主体大小会随窗口的变化而自适应。
  • ()-表示括号内的为一行

2. 模板下载地址

http://files.cnblogs.com/nayitian/htmltemplate1.rar

模板图一(35.h-(bx-r)):

模板图二(36.h-(l-bx)-f),有footer,画面小,看不到:

3. 参考源代码

index.html

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>2列右侧固定左侧自适应宽度+头部——<a href="http://www.aa25.cn">标准之路www.aa25.cn</a></title>
<link href="layout.css" rel="stylesheet" type="text/css" />
<meta name="Keywords" content="标准之路,www.aa25.cn,网页标准布局,DIV+CSS" />
<meta name="" content="标准之路,www.aa25.cn,网页标准布局,DIV+CSS" />
<meta name="author" content"×××,有问题请到www.68css.cn网站留言" />
<meta name="Description" content="本套网页标准布局模板是由标准之路(www.aa25.cn)制作完成,如果您要转载,请保留版权" />
</head><body>
<div id="container"><div id="header">This is the Header</div><div id="mainContent"><div id="sidebar">This is the sidebar</div><div id="content">2列右侧固定左侧自适应宽度+头部——<a href="http://www.aa25.cn">标准之路www.aa25.cn</a></div><span style="display:none"><script language="javascript" type="text/javascript" src="http://js.users.51.la/1967272.js"></script></span></div>
</div>
</body>
</html>

layout.css

/*本模板是由标准之路(www.aa25.cn)的×××制作完成*/
/*本人水平有限,使用自愿,不对因使用此模板造成的任何后果负任何责任*/
/*如果您想转载此资源,请保留“<a href="http://www.aa25.cn">标准之路www.aa25.cn</a>”的链接及版权标识*/
/*如有更好的建议或意见,请到www.aa25.cn留言,本人尽力解决*/
/*2008-8-28*/
body { font-family:Verdana; font-size:14px; margin:0;}#container {margin:0 auto; width:100%;}
#header { height:100px; background:#9c6; margin-bottom:5px;}
#mainContent { height:500px; margin-bottom:5px;}
#sidebar { float:right; width:200px; height:500px; background:#cf9;}
#content { margin-right:205px !important; margin-right:202px; height:500px; background:#ffa;}

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_769560.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

探测网站(四)burp suite暴力猜解密码

2019独角兽企业重金招聘Python工程师标准>>> burp suite的intruder模块用来自动探测Web应用程序&#xff0c;我们可以用它来暴力猜解用户名和密码。首先准备用户名和密码字典&#xff0c;这个网上可以用csdn、天涯、人人等泄露的用户名和密码&#xff0c;也可以用字…

JMS-使用消息队列优化网站性能

为什么80%的码农都做不了架构师&#xff1f;>>> 在当今互联网和电商盛行的情况下&#xff0c;网站的性能受到了极大地挑战。大数据&#xff0c;高并发成为大型网站的标志。无论淘宝的双11优惠&#xff0c;还是小米抢购&#xff0c;它们都有一个共同的特点&#xff…

PHP识别电脑还是手机访问网站

为什么80%的码农都做不了架构师&#xff1f;>>> <?php function isMobile(){ $useragentisset($_SERVER[HTTP_USER_AGENT]) ? $_SERVER[HTTP_USER_AGENT] : ; $useragent_commentsblockpreg_match(|\(.*?\)|,$useragent,$matches)>0?$matches[0]:; …

网站首页轮番图的后台管理

如下图&#xff0c;很多CMS的首页都会有实时更新的轮番图的需求&#xff1a; 最近在做一个CMS的过程中&#xff0c;就遇到了这样的需求。 之前曾经做过一个校园网站的项目&#xff08;自己做着玩玩&#xff09;&#xff0c;但前台的轮番图是写死在页面上的&#xff0c;即&#…

Https网站中请求Http内容

Https网站中请求Http内容Https网站中无法请求Http资源&#xff08;静态资源、接口等&#xff09;分析解决方法Https网站中无法请求Http资源&#xff08;静态资源、接口等&#xff09; 今天遇到个问题&#xff1a;Mixed Content: The page at ‘https://*****’ was loaded over…

Windows server 2012配置WebDeploy发布网站

以前都是使用win2008r2服务器&#xff0c;最近更新了操作系统到WINDOWS 2012,发现以前的做法已经不适用了。 win2008r2配置WebDeploy&#xff1a; https://www.cnblogs.com/xcsn/p/7067841.html 下面直接进入主题 一、下载安装 1.下载web平台组件 2.安装 先安装WEB DEPLOY 3.5&…

网站日志分析诊断及其作用

相信大家都知道网站日志是什么东西&#xff0c;可是做SEO的有多少人会去关注分析网站日志呢&#xff0c;又有多少SEOer能看懂网站日志呢&#xff1f;今天就给大家讲解下在网站SEO优化中&#xff0c;怎样利用网站日志的诊断和分析来提高网站关键词的排名。 首先我们仙说下网站日…

设计师升职加薪必须知道的10个设计网站

设计行业经过几年的发展&#xff0c;已经进入到了相对成熟的时期。这无疑会对设计师有更高的要求和挑战。随着AI的发展&#xff0c;设计甚至从有形的设计&#xff0c;转变为无形的设计。这就需要你对设计有更深刻的理解&#xff0c;理解设计的本质是沟通&#xff0c;设计源于人…

阿里云--域名,主机,备案都配置好了,就是不能访问网站的解决方案

异常处理汇总 ~ 修正果带着你的Net飞奔吧&#xff01;http://www.cnblogs.com/dunitian/p/4599258.html 1.解析问题&#xff1a;参考这个文章&#xff1a;http://www.cnblogs.com/dunitian/p/4977261.html 2.主机设置问题&#xff1a; 主机管理 http://cp.aliyun.com/ 主机里面…

网站跳转劫持漏洞的发现与修复建议

2019独角兽企业重金招聘Python工程师标准>>> 网站渗透测试是指在没有获得网站源代码以及服务器的情况下&#xff0c;模拟入侵者的攻击手法对网站进行漏洞检测&#xff0c;以及渗透测试&#xff0c;可以很好的对网站安全进行全面的安全检测&#xff0c;把安全做到最大…

大型网站技术架构(一)大型网站架构演化

2019独角兽企业重金招聘Python工程师标准>>> 看完了有一本书&#xff0c;就应该有所收获&#xff0c;有所总结&#xff0c;最近把《大型网站技术架构》一书给看完了&#xff0c;给人的印象实在深刻&#xff0c;再加上之前也搞过书本上讲的反向代理和负载均衡以及ses…

大型网站技术架构(六)网站的伸缩性架构

2019独角兽企业重金招聘Python工程师标准>>> 网站系统的伸缩性架构最重要的技术手段就是使用服务器集群功能&#xff0c;通过不断地向集群中添加服务器来增强整个集群的处理能力。“伸”即网站的规模和服务器的规模总是在不断扩大。 1、网站架构的伸缩性设计 网站的…

大型网站技术架构-发展过程

2019独角兽企业重金招聘Python工程师标准>>> 网站都是从小网站一步一步发展为大型网站的&#xff0c;而这之中的挑战主要来自于庞大的用户、安全环境恶劣、高并发的访问和海量的数据&#xff0c;任何简单的业务处理&#xff0c;一旦需要处理数以 P 计的数据和面对数…

Python一课一练(建立第一个个人网站)

2019独角兽企业重金招聘Python工程师标准>>> 使用Python来上手建站比较简单 安装lpthw.web框架&#xff0c;使用pip来安装&#xff0c;在powershell输入"pip install lpthw.web"还记得我们的工程结构吗&#xff1f;不过这次在"skeleton"目录下增…

云主机如何选带宽-- 1M带宽有多快--建站必考虑因素

对于很多新手来说&#xff0c;在选购服务器的时候可能会有些疑问&#xff0c;我应该买多大的带宽&#xff0c;或者是我买了1M的带宽怎么最快的传输速度只有120kB左右&#xff0c;有以上疑惑的朋友不着急&#xff0c;接下来我就带大家分析看看。 一、在分析之前我们要搞清楚几…

wordpress网站压测--Ubuntu下Apache2 的调优(待续)

最近我在对自己建的一个用wordpress搭建的网站使用进行压测。 设备 2核2G突发性实例&#xff08;20%基准CPU计算性能 &#xff09; 带宽2M 工具 1、 压测工具 Jmeter 环境 1、Unbuntu16.04 2、Apache2.4.18 3、wordpress 5.3.2 4、php7.0 5、MySQL 5.6.29 压力测…

iis6服务器网站批量迁移,使用MS Web Deploy工具从IIS 6.0迁移大量应用到IIS 7.0

情人节&#xff0c;虽然一个人过&#xff0c;可是也不想加班&#xff0c;刚找到这篇文章就到点下班了&#xff0c;明天再测试行不行这里给大家介绍一下WebDeploy这个IIS的迁移工具。Windows server 2008r2在web服务上做了很大的提升&#xff0c;Windows server 2008的IIS7从核心…

MapReduce编程案例之电商网站日志的行为分析

目录一、需求分析二、程序编写一、需求分析 1.网站数据分析的四个指标&#xff1a; PV&#xff1a;PageView ,浏览量 用户每打开一个网页就会被记录1次浏览量&#xff0c;多次打开同一个页面浏览量累计加一 UV&#xff1a;Unique Visitor 独立访客数 同一用户多次访问&#x…

基于Sqoop+Hive+MySQL网站日志分析项目实战

目录一、需求分析及数据准备&#xff08;1&#xff09;需求分析&#xff08;2&#xff09;实施分案&#xff08;3&#xff09;准备数据二、pvuv数据分析三、导出结果四、企业优化方案五、编写自动加载数据脚本六、编写自动调度数据分析七、运行测试一、需求分析及数据准备 &am…

基于Spark SQL对新闻网站项目案例分析

目录一、需求分析二、数据准备&#xff08;1&#xff09;数据格式&#xff08;2&#xff09;基于Java开发离线数据生成器&#xff08;3&#xff09;基于业务数据创建hive表三、数据模型&#xff08;1&#xff09;需求一&#xff1a;对网站的pv分析&#xff08;2&#xff09;需求…