text简单的cssdotleaders(代码片段)

author author     2022-12-01     473

关键词:

<!DOCTYPE html>
<html>
<head>
  <!-- Feel free to use and modify however you like http://AlanSimpson.me -->
  <title>CSS Dot Leaders</title>
  <style>
    ul.dotleaders 
      list-style: none;
      padding: 0;
      /* This width can be whatever you like */
      width: 640px;
      /* Keeps extra dots from appearaing past last character */
      overflow-x: hidden;
    

      ul.dotleaders li:before 
        float: left;
        /* Keeps dots on same line as text */
        width: 0;
        /* Prevents word wrap */
        white-space: nowrap;
        /* Just a lot of dots with a space in between, no specific number */
        content: ". . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ";
      

      ul.dotleaders li span:first-child 
        padding-right: 0.33em;
        /* Helps to cover dots under the words */
        background-color: white;
      

      ul.dotleaders li span + span 
        float: right;
        padding-left: 0.33em;
        /* Helps to cover dots under the price */
        background-color: white;
      
  </style>

</head>
<body>
  <ul class="dotleaders">
    <li><span>Beef Tostada</span><span>$3.95</span></li>
    <li><span>Super Nachos</span><span>$4.98</span></li>
    <li><span>Quesadilla</span><span>$2.49</span></li>
    <li><span>Chimichanga</span><span>$5.49</span></li>
    <li><span>Everything Dinner</span><span>$12.49</span></li>
  </ul>
</body>
</html>

text简单的菜单(代码片段)

查看详情

text简单的饼干操作(代码片段)

查看详情

text简单模式的标记(代码片段)

查看详情

text简单的猫命令(代码片段)

查看详情

text简单的手风琴(代码片段)

查看详情

text超级简单的cssdropcap(代码片段)

查看详情

text简单的系统alertdialog(代码片段)

查看详情

text使用简单的jquery评级星(代码片段)

查看详情

text简单的css媒体查询-移动优先(代码片段)

查看详情

text非常简单的html电子邮件(代码片段)

查看详情

text用于raspberripi相机的简单mjpeg流光(代码片段)

查看详情

text我简单的mysql命令行cheatsheet(代码片段)

查看详情

text我简单的mysql命令行cheatsheet(代码片段)

查看详情

text我简单的mysql命令行cheatsheet(代码片段)

查看详情

text我简单的mysql命令行cheatsheet(代码片段)

查看详情

text教程:创建一个简单的管道(codecommit存储库)(代码片段)

查看详情

text带有dockerpost命令的awsec2简单ami(代码片段)

查看详情

text一个简单的solidity程序,带有getters和setter(代码片段)

查看详情