|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
您现在的位置: ChinaBeta.cn 中文IT资讯 >> 网盟学院 >> 网站设计 >> 网管技术正文
推荐网管技术让我穿过那道"墙"! 畅游网络应…推荐网管技术主动防御!瑞星杀毒2008抢先评…
推荐网管技术速度超快 Discuz! 6.0.0试用手…推荐网管技术奇虎举证:各杀毒软件均报CNNIC…
推荐网管技术Google Earth 4.2加入繁体中文…推荐网管技术专业防护!瑞星防火墙2008测试…
推荐网管技术挂载RAR文件 从认识到爱上WinM…推荐网管技术让你冲浪随心所欲 如何访问被封…
推荐网管技术轻装上阵!江民杀毒软件2008速…推荐网管技术VMware Fusion苹果版全程图解(…
推荐网管技术VMware Fusion苹果版全程图解(…推荐网管技术从菜鸟出发!征服高清详细评测全…
推荐网管技术VS2008和ASP.NET 3.5使用之初体…推荐网管技术[多图]Ubuntu 7.04 初体验
推荐网管技术东风吹战鼓擂 下载软件你选谁?推荐网管技术若隐若现 Windows XP DirectX …
推荐网管技术GPRS上网全攻略推荐网管技术主流杀毒软件Vista兼容性横评
推荐网管技术基于IRF的网络管理和业务管理解…推荐网管技术83个美丽的Wordpress主题
推荐网管技术软交换网络中的关键路由技术详…推荐网管技术不只是换肤?Windows Mobile 6 …
推荐网管技术css教程–十步学会用css建站(全…推荐网管技术巧妙设置路由 预防网络频繁掉线
推荐网管技术打造网络管理七大绝技推荐网管技术CorelDRAW X3 Service Pack 2 …
推荐网管技术重温经典:回归 Live Messenger…推荐网管技术Oracle数据库补丁分类、安装及…
css教程–十步学会用css建站(全)
Www.ChinaBeta.Cn 更新时间:2007-2-26 阅读次数:

【ChinaBeta.Cn 网盟学院】

第二步:创建html模板及文件目录等 1.创建html模板。代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title>CompanyName - PageName</title>
<meta http-equiv="Content-Language" content="en-us" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="MSSmartTagsPreventParsing" content="true" />
<meta name="description" content="Description" />
<meta name="keywords" content="Keywords" />
<meta name="author" content="Enlighten Designs" />
<style type="text/css" media="all">@import "css/master.css";</style>
</head>
<body>
</body>
</html>

将其保存为index.html,并创建文件夹css,images,网站结构如下:

layout

2.创建网站的大框,即建立一个宽760px的盒子,它将包含网站的所有元素。
在html文件的<body>和</body>之间写入

<div id="page-container">
Hello world.
</div>

创建css文件,命名为master.css,保存在/css/文件夹下。写入:

#page-container {
width: 760px;
background: red;
}

控制html的id为page-container的盒子的宽为760px,背景为红色。表现如下:
layout
现在为了让盒子居中,写入margin: auto;,使css文件为:

#page-container {
width: 760px;
margin: auto;
background: red;
}

现在你可以看到盒子和浏览器的顶端有8px宽的空隙。这是由于浏览器的默认的填充和边界造成的。消除这个空隙,就需要在css文件中写入:

html, body {
margin: 0;
padding: 0;
}

上一页  [1] [2] [3] [4] [5] [6] [7] [8] [9] [10] 下一页  

Google

(责任编辑:hahack)

发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口
热门文章 相关报道
普通网管技术 [软件应用]凤凰涅槃 驱动精灵2008归来 (01-03)最新网管技术
普通网管技术 [ASP|ASP.NET]为ASP.NET MVC框架添加AJAX支持 (01-02)最新网管技术
普通网管技术 [JSP|JAVA]从Java到Ruby:献给引路人的策略 (01-02)最新网管技术
普通网管技术 [PHP]PHP多文件上传实例 (01-02)最新网管技术
普通网管技术 [其它编程程序]QQ 静态截图完善实现之改造 CRec… (01-02)最新网管技术
普通网管技术 [其它编程程序]C++运算符重载转换运算符 (01-02)最新网管技术
普通网管技术 [其它编程程序]详细解析C++编写的ATM自动取款机… (01-02)最新网管技术
普通网管技术 [其它编程程序]C++中用vectors改进内存的再分配 (01-02)最新网管技术
普通网管技术 [其它编程程序]C++中的虚函数((((virtual funct… (01-02)最新网管技术
普通网管技术 [其它编程程序]C++中用函数模板实现和优化抽象操… (01-02)最新网管技术
  • Dreamweaver教程:CSS制作细…

  • Dreamweaver教程:CSS制作细…

  •   网友评论内容:(只显示最新10条。评论内容只代表网友观点,与本站立场无关!)
    I D *
    邮 箱
    主 页
    评 分 1分 2分 3分 4分 5分
    评 论

    关于我们  中国·国家信息产业部{粤ICP备06006652号}{陇ICP备06002562号}
    版权所有:『AK网盟基地』站长:Hahack | QQ:80505955 | E-mail:Hahack@Gmail.com
    Copyright (C) 2005-2007  akhack.org|chinabeta.cn All Rights Reserved