在网页制作过程过中，可以把一些独立的逻辑部分划分出来，放在一个<div>标签中，这个<div>标签的作用就相当于一个容器。

语法：

<div>…</div>

确定逻辑部分：

什么是逻辑部分？它是页面上相互关联的一组元素。如网页中的独立的栏目版块，就是一个典型的逻辑部分。如下图所示：图中用红色边框标出的部分就是一个逻辑部分，就可以使用<div>标签作为容器。

示例:

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>div标签</title>

</head>

<body>

    <div>

        <h2>热门课程排行榜</h2>

        <ol>

            <li>前端开发面试心法 </li>

            <li>零基础学习html</li>

            <li>javascript全攻略</li>

        </ol>

    </div>

    <div>

        <h2>最新课程排行</h2>

        <ol>

            <li>版本管理工具介绍—Git篇 </li>

            <li>Canvas绘图详解</li>

            <li>QQ5.0侧滑菜单</li>

        </ol>

    </div>

</body>

</html>

认识div(division)在排版中的作用的更多相关文章

  1. 认识div在排版中的作用

    在网页制作过程过中,可以把一些独立的逻辑部分划分出来,放在一个<div>标签中,这个<div>标签的作用就相当于一个容器. 语法: <div>-</div&g ...

  2. ES5与ES6常用语法教程之 ④展开运算符...在数组和对象中的作用

    展开操作符(spread) 展开运算符(spread operator)允许一个表达式在某处展开.展开运算符在多个参数(用于函数调用)或多个元素(用于数组字面量)或者多个变量(用于解构赋值)的地方可以 ...

  3. js中!!的作用

    js中!!的作用是: !!一般用来将后面的表达式转换为布尔型的数据(boolean) ===表示类型什么的全部相等(自己写一个if测试一下就好了)!==表示要全部不想等包括类型(一样写一个if)||或 ...

  4. emms指令在MMX指令中的作用

    emms指令在MMX指令中的作用 转自:http://blog.csdn.net/psusong/archive/2009/01/08/3737047.aspx MMX和SSE都是INTEL开发的基于 ...

  5. div a 和 div > a 的区别———后者指作用到div下一级的 a 标签 ，仅一级

    div a 和 div > a 的区别---后者指作用到div下一级的 a 标签 ,仅一级 如: <div> <a href="#">可以作用到< ...

  6. 什么是Zookeeper，Zookeeper的作用是什么，在Hadoop及hbase中具体作用是什么

    什么是Zookeeper,Zookeeper的作用是什么,它与NameNode及HMaster如何协作?在没有接触Zookeeper的同学,或许会有这些疑问.这里给大家总结一下. 一.什么是Zooke ...

  7. 段落排版--中文字间距、字母间距(letter-spacing, word-spacing)

    中文字间隔.字母间隔设置: 如果想在网页排版中设置文字间隔或者字母间隔就可以使用    letter-spacing 来实现,如下面代码: h1{ letter-spacing:50px; } ... ...

  8. SET STATISTICS IO和SET STATISTICS TIME 在SQL Server查询性能优化中的作用

    近段时间以来,一直在探究SQL Server查询性能的问题,当然也漫无目的的查找了很多资料,也从网上的大神们的文章中学到了很多,在这里,向各位大神致敬.正是受大神们无私奉献精神的影响,所以小弟也作为回 ...

  9. WCF技术剖析之十五：数据契约代理（DataContractSurrogate）在序列化中的作用

    原文:WCF技术剖析之十五:数据契约代理(DataContractSurrogate)在序列化中的作用 [爱心链接:拯救一个25岁身患急性白血病的女孩[内有苏州电视台经济频道<天天山海经> ...

随机推荐

  1. KeilC51使用详解 (一)

    第一节 系统概述 Keil C51是美国Keil Software公司出品的51系列兼容单片机C语言软件开发系统,与汇编相比,C语言在功能上.结构性.可读性.可维护性上有明显的优势,因而易学易用.用过 ...

  2. JVM上的随机数与熵池策略

    在apache-tomcat官方文档:如何让tomcat启动更快里面提到了一些启动时的优化项,其中一项是关于随机数生成时,采用的“熵源”(entropy source)的策略. 他提到tomcat7的 ...

  3. 在线LCA模板

    在线LCA 如求A,B两点的LCA,先计算出各个结点的深度d[],然后,通过递推公式求出各个结点的2次方倍的祖先p[],假设d[A] > d[B],则找到d[p[A][i]] == d[B]也就 ...

  4. supesite 标签语法

    http://blog.sina.com.cn/s/blog_a3c7706701018c8o.html

  5. 二次战CPP链表

    Felling By Ruiy: Pre-learnning link list knowloages 熟悉 指针相关操作应用+结构体数据类型应用,且能简单融合使用,堆内存(内存泄露)->类似于 ...

  6. poj1003

    题目大意:超越悬挂 你可以把卡片最远堆到距离桌子多远?如果你有一张卡片,你可以堆卡片长度的一半如果有两张卡片那么可以堆1/2+1/3=5/6,如果有n张卡片那么可以堆1/2+1/3+1/4+..... ...

  7. Redis的Java客户端Jedis的八种调用方式(事务、管道、分布式)介绍

    jedis是一个著名的key-value存储系统,而作为其官方推荐的java版客户端jedis也非常强大和稳定,支持事务.管道及有jedis自身实现的分布式. 在这里对jedis关于事务.管道和分布式 ...

  8. Web前端之HTML

    一. HTML介绍: 1.HTML:超文本标记语言. 2.HTML是由:标签和内容构成. 3.程序语言有两种:解释性语言(HTML.PHP.Python.Javascript)和编译型语言(C.C++ ...

  9. shell 二元操作符 =~

    17:14 [logc@a005.client.hadoop.qingdao.youku]$ a=1 17:14 [logc@a005.client.hadoop.qingdao.youku]$ if ...

  10. PyCharm4注册码

    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 name : newasp == ...