Question

我正在创建一个网站，其中包含菜单，并且有一个类顶部栏，并且具有白色背景，我想让它不完整但仍然可以看到我使用Dreamweaver的白色，所以我该怎么做

<html>
<head>
<title></title>
<style type="text/css">
a{
text-decoration:none;
color:black;
}
a:hover{
text-decoration:underline;
}
ul{
list-style:none;

}
li{
float:left;
font-size:20px;
padding-left:10px;

}
.background{
margin:0;
background-image:url("MWYLJ6SRDM.jpg");
background-size:1380px  auto;
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;

}
.topbar{
background-color:white;
height:50px;
width:100%;
color:black;
position:fixed;
z-index:1;
}

</style>
</head>
<body class="background">
<div class="topbar">
<ul>
<li><a href="">Home</a></li>
<li><a href="">About Us</a></li>
<li><a href="">Contact Us</a></li>
</ul>
</div>
</body>
</html>

Answer 1

您可以使用：

(function() {
    'use strict';

    var myapp = angular
        .module('app.tables')
        .controller('NGTableCtrl', NGTableCtrl);

function parseDate(input) {
              return Date.parse(input); 
            }

           myapp.filter("dateRangeFilter", function() {
            return function(items, from, to) {
                  var df = parseDate(from);
                  var dt = parseDate(to);
                  var result = [];        
                  for (var i=0; i<items.length; i++){
                      var date_bet = items[i].datetime;
                      if (date_bet > df && dt > date_bet)  {
                          result.push(items[i]);
                      }
                  }
                  return result;
            };
          });

    NGTableCtrl.$inject = ['$filter', '$http', 'ngTableParams', '$resource', '$timeout', 'ngTableDataService'];
    function NGTableCtrl($filter, $http, ngTableParams, $resource, $timeout, ngTableDataService) {
        var vm = this;
        vm.title = 'Controller';

        activate();





        function activate() {
          vm.today = function() {
                vm.dt2 = new Date(2015,11,26);
                vm.dt1 = new Date(2015,11,17);

              };    

              vm.today();
              vm.toggleMin = function() {
                vm.minDate = vm.minDate ? null : new Date();
              };
              vm.toggleMin();
              vm.maxDate = new Date(2020, 5, 22);

              vm.open1 = function($event) {
                vm.status1.opened = true;
              };

              vm.open2 = function($event) {
                vm.status2.opened = true;
              };

              vm.setDate = function(year, month, day) {
                vm.dt1 = new Date(year, month, day);
                vm.dt2 = new Date(year, month, day);

              };

              vm.dateOptions = {
                formatYear: 'yy',
                startingDay: 1
              };

              vm.formats = ['dd-MMMM-yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy', 'shortDate'];
              vm.format = vm.formats[0];

              vm.status1 = {
                opened: false
              };

              vm.status2 = {
                opened: false
              };
                  var tableData = [];
                  var ratingData = [];

                vm.tableParams5 = new ngTableParams({
                page: 1,
                count: 10,
                sorting: {
                    image_url: 'asc',
                    title: 'asc',
                    seller_name: 'asc',
                    price: 'asc',
                    product_rating: 'asc',
                    vendor_rating: 'asc'     
                },
                 filter: {
                    image_url: '',
                    title: '',
                    seller_name: '',
                    price: '',
                    product_rating: '',
                    vendor_rating: ''

                }
            },{
                total:tableData.length,

                getData : function($defer,params){
                  ngTableDataService.getData( $defer, params);
                    $http.get('/reviews/').then(function(response) {
                        tableData = response.data.product_whole_data;
                        console.log(tableData);

                        var filteredData = params.filter() ?
                         $filter('filter')(tableData, params.filter()) :
                         tableData;

                        var orderedData = params.sorting() ?
                          $filter('orderBy')(filteredData, params.orderBy()) :
                          filteredData;
                          params.total(orderedData.length);

                        $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));

                    });
                }


            });

＆＃34; 0.5＆＃34;示例中的值表示不透明度值，您可以在那里调整透明度。其他值表示RGB值，因此您可以使用它们调整背景颜色。

如果您想使用十六进制值，可以使用the one from MDN:技术。

Answer 2

<html>
<head>
<title></title>
<style type="text/css">
a{
text-decoration:none;
color:black;
}
a:hover{
text-decoration:underline;
}
ul{
list-style:none;

}
li{
float:left;
font-size:20px;
padding-left:10px;

}
.background{
margin:0;
background-image:url("MWYLJ6SRDM.jpg");
 background-color: hotpink;
background-size:1380px  auto;
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;

}
.topbar{
background-color:rgba(255,255,255, .7);
height:50px;
width:100%;
color:black;
position:fixed;
z-index:1;
}

</style>
</head>
<body class="background">
<div class="topbar">
<ul>
<li><a href="">Home</a></li>
<li><a href="">About Us</a></li>
<li><a href="">Contact Us</a></li>
</ul>
</div>
</body>
</html>

如何在html＆amp;中创建透明背景颜色CSS

2 个答案: