【问题标题】:How to make the kendo tooltip content left justified如何使剑道工具提示内容左对齐
【发布时间】:2015-06-28 20:53:12
【问题描述】:

我有一个剑道工具提示,当我将鼠标悬停在剑道网格中的一行上时会显示该工具提示。 工具提示的内容有多行。 这些线条默认居中显示,而我希望它们左对齐显示。

    rowTable.kendoTooltip({
                               content: textToBeDisplayed,
                               position: "bottom"
                           });

【问题讨论】:

    标签: javascript html css kendo-ui tooltip


    【解决方案1】:

    您可以覆盖.k-tooltip-content CSS 类。

     .k-tooltip-content {
            text-align:left;
        }
    

    看到这个jsFiddle example

    【讨论】:

    • 非常感谢!这完美地回答了我的问题。我已经为此修改了 kendo.common.min.css 文件并且它起作用了。
    • 请注意,这将覆盖应用程序中所有工具提示的样式。为了不干扰其他工具提示,请参阅 Sergey_T 的回答。
    【解决方案2】:

    对于那些不想覆盖 css 类的人。我在内容上添加了“内嵌”样式。

    .Content("<div style='text-align:left;'> " + myContent + "</div>")
    

    【讨论】:

      【解决方案3】:

      Codingbadger 的答案是正确的,但它会覆盖页面上所有工具提示的样式。

      这是一个仅针对特定工具提示更改样式的示例:http://jsfiddle.net/NameGrey/d4b0ez4n/5/

      $(document).ready(function() {
        $("#target").kendoTooltip({
          position: "right",
          width: "200px",
          content: "<div class='my-tooltip'>Tooltip content with <b>solid example</b></div>"
        });
      });
      

      CSS:

      .my-tooltip {
          text-align: left;
        font-size: 20px;
      }
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2021-12-23
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多