3.10新浪界面（表格）

作者: Tn299 | 来源:发表于2019-03-10 16:42 被阅读0次

3.10新浪界面（表格）
2.2.4 表格布局
医药电商竞品分析（二）
2019-03-15
你可能会用到的Bootstarp 库
2018-04-09
有关产品细节的碎碎念
微博VS简书：绿洲“爆红”对简书“币改”的启示
自定义多宫格表格
HTML5 列表、表格元素--界面展示

代码

<title>新浪微博</title>
</head>

<body>
<table width="980" cellpadding="0" cellspacing="0" align="center">
<tr><td><img src="图片素材。新浪/logo.png" width="164" height="68" alt="新浪微博"></td></tr>
<tr>
 <td>
   <table width="700" cellpadding="0" cellspacing="0">
     <tr>
          
            <td><img src="图片素材。新浪/banner.jpg" width="710" height="182" alt="加入微博，分享新鲜"></td>
     </tr>   
          <tr>
            <td bgcolor="#42AA09">  
             <img src="图片素材。新浪/icon_hot.gif">正在热议：
             <a href="#" target="_blank">全国两会</a>
             <a href="#" target="_blank">欧冠</a>
             <a href="#" target="_blank">两会微愿景</a>
             <a href="#" target="_blank">代表委员微博</a>
             <a href="#" target="_blank">春暖花开</a>
             <a href="#" target="_blank">旭日阳刚</a>
             <a href="#" target="_blank">小沈阳</a>
             <a href="#" target="_blank">西单女孩</a>
            </td>
          </tr>
     
     <tr>
       <td>
       <table width="700" cellpadding="0" cellspacing="0">
        <td>
        <table width="300" cellpadding="0" cellspacing="0">
          <tr>
           <td colspan="3"><img src="图片素材。新浪/icon_elite.gif"><strong>这些人正在使用微博</strong></td>
          </tr>
          <tr>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
          </tr>
          <tr>
           <td><a href="#" target="_blank">张三</a></td>
           <td><a href="#" target="_blank">李四</a></td>
           <td><a href="#" target="_blank">王五</a></td>
          </tr>
          <tr>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
          </tr>
          <tr>
           <td><a href="#" target="_blank">张三</a></td>
           <td><a href="#" target="_blank">李四</a></td>
           <td><a href="#" target="_blank">王五</a></td>
          </tr>
          <tr>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
          </tr>
          <tr>
           <td><a href="#" target="_blank">张三</a></td>
           <td><a href="#" target="_blank">李四</a></td>
           <td><a href="#" target="_blank">王五</a></td>
          </tr>
          <tr>
           <td colspan="3"><img src="图片素材。新浪/icon_elite.gif"><strong>有趣的人</strong></td>
          </tr>
          <tr>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
          </tr>
          <tr>
           <td><a href="#" target="_blank">张三</a></td>
           <td><a href="#" target="_blank">李四</a></td>
           <td><a href="#" target="_blank">王五</a></td>
          </tr>
          <tr>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
           <td><img src="图片素材。新浪/noavatar.gif"  height="60"></td>
          </tr>
          <tr>
           <td><a href="#" target="_blank">张三</a></td>
           <td><a href="#" target="_blank">李四</a></td>
           <td><a href="#" target="_blank">王五</a></td>
          </tr>
          <tr>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
           <td><img src="图片素材。新浪/noavatar.gif" height="60"></td>
          </tr>
          <tr>
           <td><a href="#" target="_blank">张三</a></td>
           <td><a href="#" target="_blank">李四</a></td>
           <td><a href="#" target="_blank">王五</a></td>
          </tr>
        </table>
       </td>
       <td>
        <table width="400" cellpadding="0" cellspacing="12">
          <tr>
           <td colspan="2"><img src="图片素材。新浪/icon_elite.gif"><strong>大家正在说</strong></td>
          </tr>
          <tr>
           <td rowspan="2"><img src="图片素材。新浪/noavatar.gif"></td>
           <td><a href="#">赵六</a>：2012年的第一场雪 </td>
          </tr>
          <tr>
           <td>2分钟前</td>
          </tr>
          <tr>
           <td rowspan="2"><img src="图片素材。新浪/noavatar.gif"></td>
           <td><a href="#">冯七</a>:H & M三月上架新品目录，同学们先看好了，再去逛吧  </td>
          </tr>
          <tr>
           <td>2分钟前</td>
          </tr>
          <tr>
           <td rowspan="2"><img src="图片素材。新浪/noavatar.gif"></td>
           <td><a href="#">赵六</a>：2012年的第一场雪 </td>
          </tr>
          <tr>
           <td>2分钟前</td>
          </tr>
          <tr>
           <td rowspan="2"><img src="图片素材。新浪/noavatar.gif"></td>
           <td><a href="#">冯七</a>:H & M三月上架新品目录，同学们先看好了，再去逛吧  </td>
          </tr>
          <tr>
           <td>2分钟前</td>
          </tr>
          <tr>
           <td rowspan="2"><img src="图片素材。新浪/noavatar.gif"></td>
           <td><a href="#">赵六</a>：2012年的第一场雪 </td>
          </tr>
          <tr>
           <td>2分钟前</td>
          </tr>
          <tr>
           <td rowspan="2"><img src="图片素材。新浪/noavatar.gif"></td>
           <td><a href="#">冯七</a>:H & M三月上架新品目录，同学们先看好了，再去逛吧  </td>
          </tr>
          <tr>
           <td>2分钟前</td>
          </tr>
           <tr>
           <td rowspan="2"><img src="图片素材。新浪/noavatar.gif"></td>
           <td><a href="#">赵六</a>：2012年的第一场雪 </td>
          </tr>
        </table>
        </td>
        </table>
       </td>
     </tr>
   </table>
 </td>
 <td>
   <table width="280" cellpadding="0" cellspacing="0">
     <tr>
       <td><img src="图片素材。新浪/login.gif" height="398" alt="注册微博"></td>
     </tr>
     <tr>
       <td>
       <table width="280" cellpadding="0" cellspacing="3">
         <tr>
           <td colspan="3" align="center"><img src="图片素材。新浪/title_top10.gif"></td>
         </tr>
         <tr>
          <td><img src="图片素材。新浪/num_01.gif"></td>
          <td>姚晨</td>
          <td>6,665,064 </td>
         </tr>
         <tr>
           <td><img src="图片素材。新浪/num_02.gif"></td>
           <td>小S</td>
           <td>5,728,619</td>
         </tr>
         <tr>
           <td><img src="图片素材。新浪/num_03.gif"></td>
           <td>赵薇</td>
           <td>5,503,863 </td>
         </tr>
         <tr>
           <td><img src="图片素材。新浪/num_04.gif">"</td>
           <td>蔡康永</td>
           <td>5,126,106 </td>
         </tr>
         <tr>
           <td><img src="图片素材。新浪/num_05.gif"></td>
           <td>谢娜</td>
           <td>4,756,902</td>
         </tr>
         <tr>
           <td><img src="图片素材。新浪/num_06.gif"></td>
           <td>何炅</td>
           <td>4,731,390</td>
         </tr>
         <tr>
           <td><img src="图片素材。新浪/num_07.gif"></td>
           <td>杨幂</td>
           <td> 4,336,483 </td>
         </tr>
         <tr>
           <td><img src="图片素材。新浪/num_08.gif"></td>
           <td>李冰冰</td>
           <td>4,215,463</td>
         </tr>
         <tr>
           <td><img src="图片素材。新浪/num_09.gif"></td>
           <td>黄健翔</td>
           <td>4,163,532</td>
         </tr>
         <tr>
           <td><img src="图片素材。新浪/num_10.gif"></td>
           <td>李开复</td>
           <td>4,143,714 </td>
         </tr>
       </table>
       </td>
     </tr>
     <tr>
      <td>
      <table width="280" cellpadding="0" cellspacing="7">
       <tr>
         <td rowspan="3" valign="top"><img src="图片素材。新浪/icon_mobile.gif"></td>
         <td>如何用手机上微博 </td>
       </tr>
       <tr>
         <td>WAP版微博地址：t.sina.cn </td>
       </tr>
       <tr>
         <td>更多方式>> </td>
       </tr>
      </table>
      </td>
     </tr>
   </table>
 </td>
</tr>
<tr bgcolor="#D6F3F7">
  <td>
    <table width="700" cellpadding="0" cellspacing="0">
      <tr>
         <td>
           <a href="#" target="_blank">帮助</a>
           <a href="#" target="_blank">意见反馈</a>
           <a href="#" target="_blank">微博认证及合作</a>
           <a href="#" target="_blank">开放平台</a>
           <a href="#" target="_blank">微博招聘</a>
           <a href="#" target="_blank">新浪网导航</a>
         </td>
      </tr>
      <tr>
           <td>客服电话：400 690 0000 提示音后按1键 (按当地市话标准计费)</td>
      </tr>
    </table>
  </td>
  <td>
    <table width="280" cellpadding="0" cellspacing="0">
      <tr>
        <td>新浪公司 版权所有 </td>
        <td rowspan="2"><img src="图片素材。新浪/jubao.gif" alt="举报中心"></td>
      </tr>
      <tr>
        <td>语言：中文(简体) </td>
      </tr>
    </table>
  </td>
</tr>
</table>
</body>

效果图

image.png

单元格中创建表格要注意<tr>后面有没有加<td>！！！

总是忘加

image.png

3.10新浪界面（表格）
代码效果图单元格中创建表格要注意后面有没有加！！！
2.2.4 表格布局
表格布局的概念表格布局（TableLayout）是以表格形式排列控件的，通过行和列将界面划分为多个单元格，每个单...
医药电商竞品分析（二）
4. 产品层面 4.1 UI界面 4.1.1 Logo设计（表格略） 4.2 功能设计总结（表格对比略）从以上...
2019-03-15
实验内容：关于线性布局、约束布局及表格布局的使用主要代码：主界面：线性布局：约束布局：表格布局：截图：...
你可能会用到的Bootstarp 库
1. 表格 Bootstrap Table 支持 Bootstrap 3 和 Bootstrap 2 自适应界面 ...
2018-04-09
1. 表格 Bootstrap Table 支持 Bootstrap 3 和 Bootstrap 2 自适应界面 ...
有关产品细节的碎碎念
主要说两个网站：新浪微博、界面。 1、新浪微博说新浪微博源于这两天发现它做的一个小小的改变。我承认我是一个非常苛...
微博VS简书：绿洲“爆红”对简书“币改”的启示
2019年9月1日，新浪微博低调发布内测版新产品“绿洲”，绿洲App是新浪推出的首款基于区块链理念的应用产品，界面...
自定义多宫格表格
我们经常看到很多UI界面都有涉及到多宫格表格，对于这类界面，我们一般用UICollectionView来实现它。但...
HTML5 列表、表格元素--界面展示
列表元素和表格元素即展示信息的界面，主要用于显示信息，不需要用户直接输入信息的界面。界面展示元素常用的有4个：u...