Question

我不明白_MD，_S或_T在这个CSS中做了什么。我想了解它为什么要格式化。我还想修改格式，以便所有三个条看起来像第一个图像。

如果我使用[#trackBar_MD]将css应用到第一个Trackbar，它可以正常工作。这个顶栏是我希望它们看起来像的样子。如果我删除_MD，_S和_T。它没有正确格式化。如果我使用[.trackbar]和_MD，_S，_T使用下面的代码它格式化所有轨道栏，如[#trackBar] [ enter image description here ] 3

以下代码生成了第3张图片。

＆＃13;

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="VerticalSlider.aspx.cs" Inherits="SliderTool.VerticalSlider" %>

<%@ Register Assembly="DevExpress.Web.v16.1, Version=16.1.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" Namespace="DevExpress.Web" TagPrefix="dx" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

        <style type="text/css">
        .dxeTBHSys.center 
        {
            margin: 60px auto;
        }
        .dxeTBVSys.center 
        {
            margin: auto;
        }

        .trackBar_MD
        {
            background: transparent url("/Content/img/Drag.png") no-repeat scroll 0% 0%;
            left: 174px; 
            top: -7px;
            width: 50px; 
            height: 16px;
            background-size: 100%;
        }

        .trackBar_T
        {
            background-image:none;
            background-color:black;
        }
        
        .trackBar_S
        {
            background-image:none;
        }

    </style>
</head>
<body>
    <form id="form1" runat="server">
      <div style="float: left; width: 100%">
        <div style="float: left; width: 50%; height: 350px">
            <div style="border: thin solid black;  margin-left: auto; margin-right: auto; height: 350px">
                <br /><br />
            <dx:ASPxTrackBar ID="trackBar" CssClass="center trackBar trackBar_MD trackBar_S trackBar_T" runat="server" MinValue="0" MaxValue="50" Step="1" 
                LargeTickInterval="10" SmallTickFrequency="5" EnableViewState="false">
            </dx:ASPxTrackBar>
                            <dx:ASPxTrackBar ID="trackBar1" CssClass="center trackBar trackBar_MD trackBar_S trackBar_T" runat="server" MinValue="0" MaxValue="50" Step="1" 
                LargeTickInterval="10" SmallTickFrequency="5" EnableViewState="false">
            </dx:ASPxTrackBar>
                            <dx:ASPxTrackBar ID="trackBar2" CssClass="center trackBar trackBar_MD trackBar_S trackBar_T" runat="server" MinValue="0" MaxValue="50" Step="1" 
                LargeTickInterval="10" SmallTickFrequency="5" EnableViewState="false">
            </dx:ASPxTrackBar>
                </div>
        </div>
    </div>
    </form>
</body>
</html>

＆＃13;

呈现页面 http://pastebin.com/XPvF0ZSJ

CSS选择器逻辑

0 个答案: