对齐并居中文本 HTML/CSS？ </h1> <div class="d-flex justify-content-between"> <div> <span class="date text-grey ml-2"> 2024-02-18 </span> </div> <div> </div> </div> </div> </div> <hr /> <div class="message text-break"> <div> <div> <p>我有一个文本区域，我希望它是合理的，因此所有行的宽度都相等，并且当文本不处于最大行长度时，文本将保持在文本区域的中间。</p> <p>这是我的文本区域：</p> <pre><code><textarea class="Whiteboard" type="text" placeholder="Type something..."></textarea> </code></pre> <p>...和CSS：</p> <pre><code>textarea.Whiteboard{ resize: none; background-color: #F1F1F1; border: none; height: 500px; width: 800px; text-align: center; font-size: 50px; } </code></pre> <p>谢谢你们！</p> </div> </div> <br><div> <div> <p>不幸的是，在撰写本文时还没有具体的 CSS 解决方案来实现所需的结果。</p> <p>然而 CSS level 3 引入了一个名为“CSS level 3”的功能<code>text-align-last</code>处理块最后一行的对齐：</p> <blockquote> <p><strong><span>7.3 最后一行对齐：text-align-last 属性 http://dev.w3.org/csswg/css-text/#text-align-last-property</span></strong></p> <p>该属性描述了块的最后一行或一行如何向右在强制换行对齐之前。</p> </blockquote> <p>但它仍然在<em>工作草案</em>状态。因此浏览器支持还不够好，无法依赖这项技术（它仍然是<span>Chrome 35 上有 bug https://bugs.webkit.org/show_bug.cgi?id=76173</span>并且仅适用于 Firefox 12+）。</p> <p>Here is an <strong><span>example http://jsbin.com/yoyiy/2/edit</span></strong> which I'm not able to verify <sup>(because of my FF4. Yes! shame on me)</sup>:</p> <pre><code>textarea { white-space: normal; text-align: justify; -moz-text-align-last: center; /* Firefox 12+ / text-align-last: center; } </code></pre> </div> </div> <span style="display:none;" allenmark_388="25413143"></span> </div> <div class="mt-3 text-grey"> 本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@) <span id='ref_question'> </span> </div> <hr> <div class="row"> <div class="col-lg-12 text-muted mt-2"> <i class="icon-tags mr-2"></i> <span class="badge border border-secondary mr-2"> <h2 class="h6 mb-0 small"> <a class="text-secondary" href="/topic/969"> html </a> </h2> </span> <span class="badge border border-secondary mr-2"> <h2 class="h6 mb-0 small"> <a class="text-secondary" href="/topic/198"> css </a> </h2> </span> <span class="badge border border-secondary mr-2"> <h2 class="h6 mb-0 small"> <a class="text-secondary" href="/topic/34300"> textarea </a> </h2> </span> <span class="badge border border-secondary mr-2"> <h2 class="h6 mb-0 small"> <a class="text-secondary" href="/topic/13847"> center </a> </h2> </span> <span class="badge border border-secondary mr-2"> <h2 class="h6 mb-0 small"> <a class="text-secondary" href="/topic/156819"> justify </a> </h2> </span> </div> </div> </div> </div> <div class="d-none threadlist"> <input type="checkbox" name="modtid" value="806644" checked /> </div>  </div> <div class="card border-0 shadow-sm mb-3 col-lg-3"> <div class="card-header bg-white"> <h3 class="h6 font-weight-400 my-0"> 对齐并居中 <textarea> 文本 HTML/CSS？的相关文章 </h3> </div> <ul class="list-group list-group-flush"> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/978724" class="d-block text-truncate"> jQuery 变量在定义时声称它是未定义的 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我试图在同一页面上有两个自动填充文本框一个用于手机型号 input1 一个用于固件 input2 当两者都填充时我希望显示一个带有ID input1input2 的div 但是当在input1 中输入值时它声称phone 的变量未定义 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/978734" class="d-block text-truncate"> 将 HTML 'label' 标签与单选按钮一起使用 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 是否label标签与单选按钮一起使用吗如果是这样你如何使用它我有一个显示如下的表单 First Name text field Hair Color color drop down Description text area Salu </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/978798" class="d-block text-truncate"> 重新加载更新的 javascript> 代码而不完全重新加载 html 页面 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我正在开发一个单页 Web 应用程序它具有许多不同的功能和形式当开发一个深度我的意思是主页上没有的功能时我会经历这个循环开发代码编辑类和函数刷新整个页面一路点击直到到达我需要测试的部分有时加起来大约一分钟测试新代码 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/978817" class="d-block text-truncate"> 从字体到跨度（大小和颜色）和背面的正则表达式（VB.NET） </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我正在寻找一个正则表达式可以将我的字体标签仅具有大小和颜色属性转换为具有相关内联CSS的span标签如果有帮助的话这将在 VB NET 中完成我还需要一个正则表达式来实现相反的效果下面详细说明的是我正在寻找的转换示例 font </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/978865" class="d-block text-truncate"> 使用内联样式有哪些风险？ </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> A 内容安全政策 https developer mozilla org en US docs Web HTTP CSP with a default src or style src指令将阻止内联样式应用于 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/978955" class="d-block text-truncate"> 类方法作为 JavaScript 中的事件处理程序？ </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> JavaScript 中是否有最佳实践或通用方法将类成员作为事件处理程序考虑以下简单示例 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/979047" class="d-block text-truncate"> CSS使背景图像使用字体字符 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我想使用字体字符例如来自 font awesome 作为输入元素的背景图像 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/979051" class="d-block text-truncate"> TDD/测试 CSS 和 HTML？ [关闭] </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> Closed 这个问题需要多问focused help closed questions 目前不接受答案有没有办法测试 CSS 和 HTML 例如有时某些通知会受到某些 CSS 更改的影响我不想每次进行更改时都手动测试所有通知 Tha </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/979138" class="d-block text-truncate"> 如何在没有 JavaScript 的情况下预加载图像？ </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 在我的 HTML 页面之一上当我将鼠标悬停在某些链接上时会显示一些大图像并且加载这些图像需要一些时间我不想使用 JavaScript 来预加载图像有什么好的解决办法吗 HTML5 有一种新方法可以做到这一点即link prefe </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/979297" class="d-block text-truncate"> 将 JSON 发布到 Python CGI </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我已经安装了 Apache2 并且 Python 可以工作但我有一个问题我有两页一个是 Python 页面另一个是带有 JQuery 的 Html 页面有人可以告诉我如何让我的 ajax 帖子正常工作吗 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/979358" class="d-block text-truncate"> 如何覆盖 bootstrap 表 td 样式？ </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我正在使用 Bootstrap 3 3我有一个 HTML 代码如下 div table class table table striped tr td 03 td td 04 td td 05 td td 06 td td 07 td td </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/979414" class="d-block text-truncate"> HTML5 支持命名空间吗？ </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我们是否可以使用新标签来扩展 HTML5 例如 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/979429" class="d-block text-truncate"> 如何在php中使用一张图像绘制形状 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我需要使用图像的一部分来创建帧图像例如用户将从后端上传图像片段现在我需要根据前端用户的要求在前端创建一个框架用户将选择框架的高度和宽度然后他将选择该图像片段如下所示我没有办法做到这一点我尝试通过 css 和 html can </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/979559" class="d-block text-truncate"> 引导标签输入宽度 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我正在尝试使用引导程序标签输入 http timschlechter github io bootstrap tagsinput examples 以模态中包含的形式像这样 div class form group div </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/979589" class="d-block text-truncate"> 使 Material UI Grid 项目的子项拉伸以适合父容器的剩余高度 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 1 现状我有一个包含 4 个网格项的 Material UI 网格容器每个 Grid 项中都有一个 Typography 组件其中包含标题和包含一些内容的 Card 如下所示 2 期望的外观我希望卡片填充网格项目的剩余高度并且不超过 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/979679" class="d-block text-truncate"> 如何防止弹性项目高度因其内容而溢出[重复] </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 这个问题在这里已经有答案了我刚刚开始学习 Flex 到目前为止我印象深刻但是我对包含页眉页脚和三列的全页应用程序遇到了问题第一列包含一个项目列表由于我无法为其父级设置固定高度因此每次列表增长时它都会将页脚向下推这是一个带有 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/979957" class="d-block text-truncate"> Android中webview的截图方法 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我在 webview 中的 html5 canvas 上画了一些线并尝试使用下面的代码截取 webview 的屏幕截图 WebView webView WebView findViewById R id webview webView s </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/980052" class="d-block text-truncate"> 弹出窗口的动态高度取决于内容，可能吗？ </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 是否有可能获得一个宽度始终为 400px 的弹出窗口但根据弹出窗口中的内容动态高度我已经看到了这个但不知道如何将其应用到弹出窗口调整 iframe 的宽度高度以适应其中的内容 https stackoverflow com ques </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/980074" class="d-block text-truncate"> 水平对齐输入字段 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我正在尝试获取一个输入字段并且它与同一水平线上的关联提交按钮相关但事实证明这是一个挑战这是我的代码 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/980113" class="d-block text-truncate"> AngularJS 在指令运行之前通过 AJAX 检索数据 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我正在使用 AngularUIuiMap http angular ui github com directives map实例化谷歌地图的指令 uiMap 指令非常适合处理硬编码数据 mapOptions and myMarkers 但是 </div> </li> </ul> </div> <div class="col-lg-12"> <div class="card-header bg-white"> <h3 class="h6 font-weight-bold my-0"> 随机推荐 </h3> </div> <ul class="list-group list-group-flush"> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806625" class="d-block text-truncate" title='如何将我的整体程序分割成更小的、单独的文件？' aria-label='如何将我的整体程序分割成更小的、单独的文件？'> 如何将我的整体程序分割成更小的、单独的文件？ </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 在我在网上看到的所有代码中程序总是被分成许多较小的文件不过对于我所有的学校项目我只需要一个巨大的 C 源文件其中包含我使用的所有结构和函数我想学习如何将我的程序分割成更小的文件这似乎是专业标准顺便问一下这是为什么只是为了 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806626" class="d-block text-truncate" title='如何在playframework 2.0中配置FS数据库？' aria-label='如何在playframework 2.0中配置FS数据库？'> 如何在playframework 2.0中配置FS数据库？ </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 这有可能吗在框架的第一个版本中似乎很容易完成而不是使用 Default database configuration db default driver org h2 Driver db default url jdbc h2 mem </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806627" class="d-block text-truncate" title='Spark 序列化错误：当我将 Spark Stream 数据插入 HBase 时' aria-label='Spark 序列化错误：当我将 Spark Stream 数据插入 HBase 时'> Spark 序列化错误：当我将 Spark Stream 数据插入 HBase 时 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我对 Spark 如何在数据格式方面与 HBase 交互感到困惑例如当我在下面的代码片段中省略 ERROR 行时它运行良好但是添加该行后我发现了与序列化问题相关的任务不可序列化的错误如何更改代码发生错误的原因是什么我的代 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806628" class="d-block text-truncate" title='如果 LONG_MAX 为 2147483647，strtol("-2147483648", 0, 0) 是否会溢出？' aria-label='如果 LONG_MAX 为 2147483647，strtol("-2147483648", 0, 0) 是否会溢出？'> 如果 LONG_MAX 为 2147483647，strtol("-2147483648", 0, 0) 是否会溢出？ </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 根据规格strtol 如果主题序列具有预期的形式并且base的值为0 则以第一个数字开始的字符序列应被解释为整数常量如果主题序列具有预期的形式并且base的值在2到36之间则应将其用作转换的base 将每个字母赋予上面给出的值如果主题 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806629" class="d-block text-truncate" title='识别iPhone中两个字符串之间的字符串[重复]' aria-label='识别iPhone中两个字符串之间的字符串[重复]'> 识别iPhone中两个字符串之间的字符串[重复] </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 这个问题已经存在了可能的重复根据条件从 iPhone 中的字符串中检索子字符串 https stackoverflow com questions 11100379 retrieving the substring based on c </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806630" class="d-block text-truncate" title='Magento - 报价和订单之间的区别' aria-label='Magento - 报价和订单之间的区别'> Magento - 报价和订单之间的区别 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我对付款方式中如何调用报价和订单有疑问据我所知报价是提供的一组产品或服务在 magento 中报价数据是在单击 Onepage Checkout 的下订单按钮之前创建的下订单后订单数据将在 Magento 中创建如果订单得 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806631" class="d-block text-truncate" title='SLURM 对可执行文件进行多个并行调用' aria-label='SLURM 对可执行文件进行多个并行调用'> SLURM 对可执行文件进行多个并行调用 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我有一个可执行文件需要多个选项和多个文件输入才能运行可以使用可变数量的核心来调用可执行文件来运行例如可执行文件 a b c file fileA file fileB file fileZ cores X 我正在尝试创建一个 sba </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806632" class="d-block text-truncate" title='从一个文件中减去另一个文件中的行' aria-label='从一个文件中减去另一个文件中的行'> 从一个文件中减去另一个文件中的行 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我找不到真正从一个文件中减去另一个文件的答案我的目标是删除一个文件中出现在另一个文件中的行应考虑多次出现这意味着例如如果一行在文件 A 中出现 4 次而在文件 B 中仅出现一次则文件 C 应该包含其中的 3 行 File A </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806633" class="d-block text-truncate" title='具有相同菜单、相同布局的片段会导致重复的 menuitem' aria-label='具有相同菜单、相同布局的片段会导致重复的 menuitem'> 具有相同菜单、相同布局的片段会导致重复的 menuitem </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我有一个包含 2 个片段的布局这些片段使用相同的菜单因为我有另一个布局其中只有其中一个在小屏幕设备中使用我的问题是每个片段的菜单项显示在菜单中并且由于它们来自同一菜单因此它们彼此重复我需要仅显示一个片段的菜单而不是两者无 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806634" class="d-block text-truncate" title='为“SFSpeechRecognizer”实现“用户停止说话”通知' aria-label='为“SFSpeechRecognizer”实现“用户停止说话”通知'> 为“SFSpeechRecognizer”实现“用户停止说话”通知 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我正在尝试解决这个问题 SFSpeechRecognizer 检测话语结束 https stackoverflow com questions 42530634 sfspeechrecognizer detect end of uttera </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806635" class="d-block text-truncate" title='Web 应用程序中的 ORM 是什么？' aria-label='Web 应用程序中的 ORM 是什么？'> Web 应用程序中的 ORM 是什么？ </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我最近收到一家服务器公司的回复询问我们是否在应用程序中使用 ORM 来完成筛选应用程序端的所有工作如 Rails 或者我们是否编写大量 SQL 嵌入式函数等这将使数据库服务器完成所有工作为您处理谁能解释一下这是什么意思我们的 We </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806636" class="d-block text-truncate" title='负载测试 ZeroMQ (ZMQ_STREAM) 以查找它可以处理的最大并发用户数' aria-label='负载测试 ZeroMQ (ZMQ_STREAM) 以查找它可以处理的最大并发用户数'> 负载测试 ZeroMQ (ZMQ_STREAM) 以查找它可以处理的最大并发用户数 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 有没有人有任何实际场景对 ZMQ 套接字进行负载测试以获得最大数量他们可以处理的并发用户不是吞吐量看起来 ZeroMQ 在 FD 限制方面存在一些严重问题场景是有许多 Web 服务器框架吹嘘它们可以处理数百万个并发用户现在如 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806637" class="d-block text-truncate" title='React-Native：在项目或这些目录中找不到 React' aria-label='React-Native：在项目或这些目录中找不到 React'> React-Native：在项目或这些目录中找不到 React </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我们已经将 React Native 项目升级到最新的 React Native 版本 v0 61 2 和 React 16 9 0 并且它在 Android 上运行得很好当我们尝试在 iosthought 上运行它时我们收到消息 wa </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806638" class="d-block text-truncate" title='UnsupportedOperation: fileno - 如何修复此 Python 依赖项混乱？' aria-label='UnsupportedOperation: fileno - 如何修复此 Python 依赖项混乱？'> UnsupportedOperation: fileno - 如何修复此 Python 依赖项混乱？ </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我正在构建一个相当广泛的 Python 后端并且在服务器 A 上运行得很好然后我在新的开发服务器 B 上安装了该系统在该服务器上我只是从头开始再次安装了所有 pip 包事情似乎进展顺利所以我做了一个pip freeze 然后 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806639" class="d-block text-truncate" title='一台虚拟主机多个域 |通配符主机（共享主机）？' aria-label='一台虚拟主机多个域 |通配符主机（共享主机）？'> 一台虚拟主机多个域 |通配符主机（共享主机）？ </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我有以下任务创建一个可通过 20 个不同域名访问的网站相同的文件相同的文件夹相同的IP 问题共享主机这可以通过一个裸cname指向同一个公共子域来完成吗或者我们是否需要一个静态IP 问题肯定是共享托管我试图避免一一手动创建 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806640" class="d-block text-truncate" title='以编程方式在 Linux 上查找可用的声卡' aria-label='以编程方式在 Linux 上查找可用的声卡'> 以编程方式在 Linux 上查找可用的声卡 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 有没有办法使用 asoundlib 和 C 以编程方式获取系统上可用声卡的列表我想要它具有相同的信息 proc asound cards 您可以使用迭代卡片snd card next 从值 1开始获得第0张牌这是示例代码编译它gcc </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806641" class="d-block text-truncate" title='无法启动 Android 虚拟 AVD 设备' aria-label='无法启动 Android 虚拟 AVD 设备'> 无法启动 Android 虚拟 AVD 设备 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我已经成功安装了Android SDK 并将SDK Manager链接到了SDK路径然后我创建了API 8的AVD就完成了但是当我要启动虚拟设备时它没有启动并给出了类似的错误 foo can not started commend </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806642" class="d-block text-truncate" title='使用 p:calendar 在 jsf h:datatable 中进行跨字段验证' aria-label='使用 p:calendar 在 jsf h:datatable 中进行跨字段验证'> 使用 p:calendar 在 jsf h:datatable 中进行跨字段验证 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我注意到有人问了这个问题但尚未正确回答我有一个有两列的数据表开始日期 and end date 两者都包含 primefaces p calendar 控件我需要确保对于每一行第 1 列中的日期不晚于第 2 列中的日期我想将其绑定 </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806643" class="d-block text-truncate" title='使用 CQRS 和事件溯源时的唯一性验证' aria-label='使用 CQRS 和事件溯源时的唯一性验证'> 使用 CQRS 和事件溯源时的唯一性验证 </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我正在尝试使用事件源来实现我自己的 CQRS 基础设施以更好地学习它作为一个示例项目我正在实现一个博客引擎我知道它可能不是一个完美的选择但我只想做一些真实的事情我现在遇到的问题是验证每个帖子都有一个shortUrl 以及sho </div> </li> <li class="list-group-item bg-white"> <h4 class="h6 my-0"> <a href="/article/806644" class="d-block text-truncate" title='对齐并居中 <textarea> 文本 HTML/CSS？' aria-label='对齐并居中 <textarea> 文本 HTML/CSS？'> 对齐并居中 <textarea> 文本 HTML/CSS？ </a> </h4> <div class="col-lg-12 text-break text-muted brief mt-2"> 我有一个文本区域我希望它是合理的因此所有行的宽度都相等并且当文本不处于最大行长度时文本将保持在文本区域的中间这是我的文本区域 </div> </li> </ul> </div> <div class="card border-0 rounded shadow-sm mb-3"> <div class="card-header border-0 rounded-top bg-white"> <h3 class="h6 font-weight-400 my-0"> 热门标签 </h3> </div> <ul class="list-unstyled right-font d-flex flex-wrap bg-white px-3 py-2 m-0"> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57331" class="d-block text-truncate right-font"> 深度学习入门 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57330" class="d-block text-truncate right-font"> 交互多模型介绍 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57329" class="d-block text-truncate right-font"> 滤波器系列 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57328" class="d-block text-truncate right-font"> 自动驾驶算法 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57327" class="d-block text-truncate right-font"> 术语中英文对照 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57326" class="d-block text-truncate right-font"> 自动驾驶基础知识 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57325" class="d-block text-truncate right-font"> 三轴磁力计 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57324" class="d-block text-truncate right-font"> 三轴陀螺仪 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57323" class="d-block text-truncate right-font"> 三轴加速度计 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57322" class="d-block text-truncate right-font"> 通讯例程 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57321" class="d-block text-truncate right-font"> 不完整被截断的处理 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57320" class="d-block text-truncate right-font"> 控制台的输出 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57319" class="d-block text-truncate right-font"> 代码运行后 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57316" class="d-block text-truncate right-font"> 打包的问题 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57315" class="d-block text-truncate right-font"> 万字总结 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57314" class="d-block text-truncate right-font"> 语言学习路线 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57313" class="d-block text-truncate right-font"> 保姆级零基础 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57312" class="d-block text-truncate right-font"> 指令的设置以及意义 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57311" class="d-block text-truncate right-font"> 恳请前辈指指路 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57310" class="d-block text-truncate right-font"> 想卷却找不到方向 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57309" class="d-block text-truncate right-font"> 计算机大一新生 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57308" class="d-block text-truncate right-font"> 之虚函数和虚函数表 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57307" class="d-block text-truncate right-font"> 框架和第三方库汇总 </a> </h4> </li> <li class="px-2 py-1 badge-pill badge-light right-tag mr-2 mb-2"> <h4 class="h6 my-0"> <a href="/topic/57304" class="d-block text-truncate right-font"> 把普通图片生成 </a> </h4> </li> </ul> </div> </div> </div> </div> <footer class="text-muted small bg-dark py-4 mt-3" id="footer"> <div class="container"> <div class="row"> <div class="col"> Powered by Hwhale  </div> </div> </div> </footer>  <script src="/lang/zh-cn/lang.js?13"></script> <script src="/view/js/jquery.min.js?13"></script> <script src="/view/js/popper.min.js?13"></script> <script src="/view/js/bootstrap.min.js?13"></script> <script src="/view/js/copyxn.js?13"></script> <script src="/view/js/bootstrap-plugin.js?13"></script> <script src="/view/js/async.min.js?13"></script> <script src="/view/js/form.js?13"></script> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?346221f3ab3bcc7f46ef28d352ee78b9"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <script> var host = window.location.host; if (host =="www.hwhale.com"){ (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); } </script> <script> var debug = DEBUG = 0; var url_rewrite_on = 3; var url_path = '/'; var fid = 16; var uid = 0; var gid = 0; xn.options.water_image_url = '/view/img/water-small.png'; /水印图片 / watermark image/ </script> <script src="/view/js/hwhale.js?13"></script>   <a class="scroll-to-top rounded" href="javascript:void(0);"> <i class="icon-angle-up"></i> </a>  <a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"> <i class="icon-angle-down"></i> </a> </body> </html> <link href="/view/css/vs2015.css" rel="stylesheet"> <script src="/view/js/highlight.pack.js"></script> <script src="/view/js/highlightjs-badge.min.js"></script> <script> // $("code").wrapInner(document.createElement("pre")); if( $("[allenmark_388]").attr('allenmark_388')>0){ $("#ref_question").html(' 网友还发现一个类似的问题请参阅：https://stackoverflow.com/questions/'+$("[allenmark_388]").attr('allenmark_388')+'/'); } var originalElements = document.querySelectorAll('span[fhref]'); originalElements.forEach(function(originalElement) { var originalInnerText = originalElement.innerText; var originalHref = originalElement.getAttribute('fhref'); var newElement = document.createElement('span'); var newText = document.createTextNode(originalInnerText + ' ' + originalHref); newElement.appendChild(newText); originalElement.parentNode.replaceChild(newElement, originalElement); }); setTimeout(function () { var pres = document.querySelectorAll("pre>code"); for (var i = 0; i < pres.length; i++) { hljs.highlightBlock(pres[i]); } var options = { contentSelector: ".message", // Delay in ms used for `setTimeout` before badging is applied // Use if you need to time highlighting and badge application // since the badges need to be applied afterwards. // 0 - direct execution (ie. you handle timing loadDelay:0, // CSS class(es) used to render the copy icon. copyIconClass: "icon-copy", // CSS class(es) used to render the done icon. checkIconClass: "icon-heart", // hook to allow modifying the text before it's pasted onBeforeTextCopied: function(text, codeElement) { return text; // you can fix up the text here } }; window.highlightJsBadge(options); },10); </script> <style> p pre{ display: inline!important; } li pre{ display: inline!important; } "@media print { .code-badge { display: none; } } .code-badge-pre { position: relative; } .code-badge { display: flex; flex-direction: row; white-space: normal; background: transparent; background: #333; color: white; font-size: 0.8em; opacity: 0.5; border-radius: 0 0 0 7px; padding: 5px 8px 5px 8px; position: absolute; right: 0; top: 0; } .code-badge.active { opacity: 0.8; } .code-badge:hover { opacity: .95; } .code-badge a, .code-badge a:hover { text-decoration: none; } .code-badge-language { margin-right: 10px; font-weight: 600; color: goldenrod; display: none; } .code-badge-copy-icon { font-size: 1.2em; cursor: pointer; padding: 0 7px; margin-top:2; } .fa.text-success:{ color: limegreen !important} </style> <script> var forum_url = '/list/16'; var safe_token = 'PYEp61B5saqkrILHpu5wFYy5dm8_2BEsy_2FP3d_2BxgG_2BI9Zd3WBWArbjTYnJi8R275_2F0ab8EvHSIlJ_2BU9vxgcC8EEA_3D_3D'; var body = $('body'); body.on('submit', '#form', function() { var jthis = $(this); var jsubmit = jthis.find('#submit'); jthis.reset(); jsubmit.button('loading'); var postdata = jthis.serializeObject(); $.xpost(jthis.attr('action'), postdata, function(code, message) { if(code == 0) { location.reload(); } else { $.alert(message); jsubmit.button('reset'); } }); return false; }); /缩放图片，适应屏幕大小/ function resize_image() { var jmessagelist = $('div.message'); var first_width = jmessagelist.width(); / 815 : 746; 734 746/ jmessagelist.each(function() { var jdiv = $(this); var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width(); var jmessage_width = Math.min(jdiv.width(), maxwidth); jdiv.find('img, embed, iframe, video').each(function() { var jimg = $(this); var img_width = this.org_width; var img_height = this.org_height; if(!img_width) { var img_width = jimg.attr('width'); var img_height = jimg.attr('height'); this.org_width = img_width; this.org_height = img_height; } /var percent = xn.min(100, xn.ceil((img_width / jmessage_width) * 100));/ if(img_width > jmessage_width) { if(this.tagName == 'IMG') { jimg.width(jmessage_width); jimg.css('height', 'auto'); jimg.css('cursor', 'pointer'); jimg.on('click', function() { /window.open(jimg.attr('src'));/ }); } else { jimg.width(jmessage_width); var height = (img_height / img_width) jimg.width(); jimg.height(height); } } }); }); } /对于超宽的表格，加上响应式/ function resize_table() { $('div.message').each(function() { var jdiv = $(this); jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>'); }); } $(function() { resize_image(); resize_table(); $(window).on('resize', resize_image); }); /输入框自动伸缩/ var jmessage = $('#message'); jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); }); jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); }); $('#nav li[data-active="fid-16"]').addClass('active'); </script>