CSS 多列布局 三列布局

下面的代码演示了3列布局的用法。

<!DOCTYPE html>
< html >
     < head >
         < title >三列布局</ title >
         < style type = "text/css" >
             body {
                 width: 960px;
                 color: #665544;
                 margin:0 auto;}
             .column1of3, .column2of3, .column3of3 {
                 width: 300px;
                 float: left;
                 margin: 10px;}
         </ style >
     </ head >
     < body >
         < h1 style = "color:#706fd3" >软件开发,成就梦想</ h1 >
         < h2 >< a href = "https://www.liyongzhen.com/" >学编程,上利永贞网</ a ></ h2 >
         < div class = "column1of3" >
             < h3 >第一段</ h3 >
             < p >Buffer Pool 缓冲池是主存储器中的一个区域,用于在访问时缓存表和索引数据。
             缓冲池允许直接从内存处理常用数据,从而加快处理速度。 在专用服务器上,通常会
             将最多80%的物理内存分配给缓冲池。</ p >
             < p >为了提高大容量读取操作的效率,缓冲池被分成可以容纳多行的page。为了提高缓存
             管理的效率,缓冲池被实现为链接的page list。</ p >
         </ div >
         < div class = "column2of3" >
             < h3 >第二段</ h3 >
             < p >Log Buffer 日志缓冲区是保存要写入磁盘上日志文件的数据的内存区域。 日志缓冲区大
             小由innodb_log_buffer_size变量定义。 默认大小为16MB。 日志缓冲区的内容会定期刷新到磁盘。</ p >
             < p >大型日志缓冲区使大型事务能够运行,而无需在事务提交之前将重做日志数据写入磁盘。</ p >
             < p >System Tablespace InnoDB系统表空间是doublewrite缓冲区和更改缓冲区的存储区域。 系统
             表空间还包含在系统表空间中创建的用户创建表的表和索引数据。 在以前的版本中,系统表空
             间包含InnoDB数据字典。 在MySQL 8.0中, InnoDB将元数据存储在MySQL数据字典中。</ p >
         </ div >
         < div class = "column3of3" >
             < h3 >最新文章</ h3 >
             < ul >
                 < li >CSS 颜色术语</ li >
                 < li >CSS 背景颜色</ li >
                 < li >CSS 字体风格</ li >
                 < li >CSS 盒子大小</ li >
                 < li >CSS 边框</ li >
                 < li >CSS 内外边距</ li >
             </ ul >
         </ div >
     </ body >
</ html >

猜你喜欢

转载自www.cnblogs.com/lszw/p/10839078.html