<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>

<div id="container" style="width:500px">

<div id="header" style="background-color:#FFA500;">
<h1 style="margin-bottom:0;">主要的网页标题</h1></div>

<div id="menu" style="background-color:#FFD700;height:200px;width:100px;float:left;">
<b>菜单</b><br>
HTML<br>
CSS<br>
JavaScript</div>

<div id="content" style="background-color:#EEEEEE;height:200px;width:400px;float:left;">
内容在这里</div>

<div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">
版权 runoob.com</div>

</div>

</body>
</html>

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>

<div id="container" style="width:500px">

<div id="header" style="background-color:#FFA500;">
<h1 style="margin-bottom:0;">主要的网页标题</h1></div>

<div id="menu" style="background-color:#FFD700;height:200px;width:100px;float:left;">
<b>菜单</b><br>
HTML<br>
CSS<br>
JavaScript</div>

<div id="content" style="background-color:#EEEEEE;height:200px;width:400px;float:left;">
内容在这里</div>

<div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">
版权 runoob.com</div>

</div>

</body>
</html>

HTML学习如何布局的更多相关文章

  1. android基础学习之布局

    我学习android第一步接触的就是布局的学习.布局是androidUI的基础,是重中之重.总的来说android有6种布局,分别是线性布局LinearLayout.相对布局RelativeLayou ...

  2. Bootstrap学习笔记-布局

    Bootstrap学习笔记-布局 默认是响应式布局,就是你在改变页面的时候也不会出现乱的现象. <html><head> <meta charset="utf- ...

  3. android 学习 之 布局（上）

    学习安卓布局前,先了解三个属性值: 1.fill_parent: 设置一个构件的布局为fill_parent将强制性地使构件扩展,以填充布局单元内尽可能多的空间 2.match_parent: And ...

  4. 《学习CSS布局》学习笔记

    近几天做了一个小的企业展示网站.虽然页面是在模板的基础上改的,但改的多了不熟悉CSS也很麻烦.正好我看到了学习CSS布局这个网站,于是补习了一下CSS知识. CSS的显示 CSS的元素分为两类:块级元 ...

  5. “学习CSS布局” 笔记

    学习网址:http://zh.learnlayout.com/no-layout.html 本文仅为学习笔记,内容非原创. position 默认值:static 没有添加额外属性的relative和 ...

  6. GTK入门学习：布局容器之固定布局

    前面我们学习的水平.垂直和表格布局容器,控件会跟着容器大小的变化进行自己主动适应.而固定布局容器里的控件则不会跟着变化( 则固定不变 ). 固定布局的创建: GtkWidget *gtk_fixed_ ...

  7. （5）《Head First HTML与CSS》学习笔记---布局与定位

    层叠与CSS的权重判断 1.要理解层叠,除了前面的内容外还差最后一个知识点.你已经知道如何使用多个样式表来更好地组织你的样式,或者支持不同类型的设备.不过实际上用户访问你的页面时还有另外一些样式表. ...

  8. android开发学习---layout布局、显示单位和如何进行单元测试

    一.五大布局(layout) android中的用五大布局:LinearLayout (线性布局).AbsoluteLayout(绝对布局).RelativeLayout(相对布局).TableLay ...

  9. Bootstrap 新手学习笔记——布局组件

    1.字形图标: <button type="button" class="btn btn-primary btn-lg" style="font ...

  10. 3、WPF学习之-布局

    一.基础知识 1.所有WPF布局容器都派生自System.Windows.Controls.Panel抽象类的面板: 2.WPF种核心布局面板有StackPanel(栈面板).WrapPanel(环绕 ...

随机推荐

  1. java匿名内部类-细节

    1 package face_09; 2 3 public class InnerClassDemo50 { 4 static class Inner{ 5 6 } 7 public static v ...

  2. 『无为则无心』Python基础 — 43、文件备份的实现

    目录 1.需求 2.步骤 3.代码实现 (1)接收用户输入目标文件名 (2)规划备份文件名 (3)备份文件写入数据 (4)思考 (5)完整编码 4.再来一个小练习 1.需求 用户输入当前目录下任意文件 ...

  3. SpringMVC之RedirectAttributes属性

    RedirectAttributes是SpringMVC3.1版本之后出来的一个新功能,专门用于重定向之后还能带参数跳转的的工具类. 两种带参方式: redirectAttributes.addAtt ...

  4. 好用的 NPL 词库分类。

    ## 好用的 NPL 词库分类. 专业的词库分类技术. 主要服务于金融领域的词库划分. 上图!对比一下我们的分词和jie等模型的效果.做的就是专业! ![在这里插入图片描述](https://img- ...

  5. SpringBoot使用IDEA设置的外部Tomcat启动

    前言 使用springboot内嵌的tomcat启动是没问题,但是工程是要放到服务器上的tomcat的,所以springboot内嵌的能够启动,但不代表服务器的tomcat能启动起来,我就遇到了这个问 ...

  6. HDOJ acm steps 3.1.1

    (都是递推求值,呵呵,好开心- - ) 今天又是在自习室通宵(文明玩的停不下来了) 游戏玩完想想该水题了,于是打开了HDOJ的ACM STEPS(这是个好东西,就像他的名字,一步步来的) 2.3.x貌 ...

  7. Ext原码学习之lang-Object.js

    // JavaScript Document (function(){ var TemplateClass = function(){}, ExtObject = Ext.Object = { cha ...

  8. go基础——运算符

    算数运算符 /* 算术运算符:+,-,*,/,%,++,-- */ a := 10 b := 3 sum := a + b //加减乘类似 fmt.Printf("%d + %d = %d\ ...

  9. java_JDBC，连接数据库方式，RestSet结果集，Statement，PreparedStatement，事务，批处理，数据库连接池（c3p0和Druid）、Apache-DBUtils、

    一.JDBC的概述 1.JDBC为访问不同的数据薛是供了统一的接口,为使用者屏蔽了细节问题.2. Java程序员使用JDBC,可以连接任何提供了JDBC驱动程序的数据库系统,从而完成对数据库的各种操作 ...

  10. 简述CGI与FASTCGI区别

    CGI和FASTCGI都是服务器端与客户端进行交互的常见方式. CGI处理客户端请求,会生成一个子进程来专门调用外部程序来处理客户端请求,处理完成,子进程会随之关闭 FAST处理客户端请求时.服务器端 ...