css 样式不适用于 iOS 中 <ul> 和 <ol> 的 TextView答案

【问题标题】：css style don't apply inside TextView for <ul> and <ol> in iOScss 样式不适用于 iOS 中 <ul> 和 <ol> 的 TextView
【发布时间】：2018-10-24 10:37:17
【问题描述】：

我在 TextView 中显示 HTML 数据，<ul> 或 <ol> 的填充空间超出了要求，但我无法从 HTML 端使用 CSS（我更愿意使用 CSS）调整填充/边距，有什么建议如何实现吗？

<html>

<head>
  <style type="text/css">
    body {
      font-size: 14px;
      font-family: -apple-system, Arial, sans-serif;
      color: black;
      margin-bottom: 0px;
      padding-bottom: 0px;
      line-height: 20px;
    }
    
    ul,
    ol {
      padding-left: 10px;
    }
  </style>
</head>

<body>
  <p>Professionals are often vastly more comfortable solving analytical, convergent problems than those requiring more divergent thinking. In this article, Olivier Leclerc and Mihnea Moldoveanu share some strategies for stimulating truly novel thinking.
    They introduce five "flexons," which can be thought of as "languages" for shaping problems that help you bring diverse perspectives to problem solving:</p>

  <ul type="disc">
    <li>Networks</li>
    <li>Evolutionary</li>
  </ul>


  <ol>
    <li>Decision-agent</li>
    <li>System dynamics</li>
    <li>Information-processing :
      <ol>
        <li>Decision-agent</li>
        <li>System dynamics</li>
        <li>Information-processing</li>
      </ol>
    </li>
  </ol>


  <ul type="disc">
    <li>Networks :
      <ul>
        <li type="circle">Decision-agent</li>
        <li type="circle">System dynamics</li>
      </ul>
    </li>
  </ul>

</body>

</html>

这是 HTML，ul,ol {padding-left:10px;} 的 CSS 不适用。

将 HTML 字符串转换为 AttributeText 的功能

 extension NSAttributedString {
    convenience public init?(styled: String, textAlignment: NSTextAlignment = .center, color: UIColor = .black) {
        guard let data = styled.data(using: String.Encoding.unicode) else {
            return nil
        }
        do {
            let string = try NSMutableAttributedString(data: data,
                                                       options: [NSAttributedString.DocumentReadingOptionKey.documentType: NSAttributedString.DocumentType.html], documentAttributes: nil)
            let paragraphStyle = NSMutableParagraphStyle()
            paragraphStyle.alignment = textAlignment

            string.addAttributes(
                [NSAttributedStringKey.foregroundColor: color],
                range: NSMakeRange(0, string.length)
            )

            self.init(attributedString: string.removingTrailingNewLine)
        } catch {
            return nil
        }
    }

    var removingTrailingNewLine: NSAttributedString {
        if string.hasSuffix("\n") {
            return attributedSubstring(from: NSRange(location:0, length: length - 1))
        }
        return self
    }
}

图像显示填充比应有的多一点，但无法调整。

【问题讨论】：

请您添加一些代码。谢谢
@Adam 也添加了代码和屏幕截图。
所以您希望ul 和ol 看起来像您添加的屏幕截图？
这是它现在的样子，我希望左边距应该比现在显示的要小。
哦，只是做padding-left: 0，这是边距而不是填充只是为了知道。所以将margin-left: 10px 设为零。

标签： html ios css textview padding

【解决方案1】：

已经为 ol 和 ul 计算了填充和边距值，而您正在查看的是边距，因此将边距左侧更改为零或小于原始值。

检查此代码：

  ul,
ol {
  border: 1px solid red; /* for display only*/
  margin-left: 0;
  padding-left: 50px;/* change this value and see how it works */
}

<p>Professionals are often vastly more comfortable solving analytical, convergent problems than those requiring more divergent thinking. In this article, Olivier Leclerc and Mihnea Moldoveanu share some strategies for stimulating truly novel thinking. They
  introduce five "flexons," which can be thought of as "languages" for shaping problems that help you bring diverse perspectives to problem solving:</p>

<ul type="disc">
  <li>Networks</li>
  <li>Evolutionary</li>
</ul>


<ol>
  <li>Decision-agent</li>
  <li>System dynamics</li>
  <li>Information-processing :
    <ol>
      <li>Decision-agent</li>
      <li>System dynamics</li>
      <li>Information-processing</li>
    </ol>
  </li>
</ol>


<ul type="disc">
  <li>Networks :
    <ul>
      <li type="circle">Decision-agent</li>
      <li type="circle">System dynamics</li>
    </ul>
  </li>
</ul>

【讨论】：

已经试过了，问题是它不适用于TextView，它在在线编辑器上看起来不错，但在iOS设备和TextView中它保持不变。 TextView 不支持border。
在 iOS 中？什么版本和设备？
我的意思是在UITextView 内部，它在UIWebView 和WKWebView 上显示良好，但在TextView 内部它没有显示任何边框