小编use*_*abc的帖子
如何在 5 个元素之后换行列表？
我们有一个最多显示 10 个项目的无序列表。我们如何设置列表，以便将前五个项目放在左侧，并将接下来的五个项目放入下一列（均等分割）？
这是当前和所需的输出。我们尝试使用CSS Flexbox，但找不到方法。如果 Flexbox 无法完成，请接受其他想法。
这是当前结果和期望的输出。
ul {
display: flex;
flex-direction: column;
flex: 0 1 auto;
}<div>
<ul>
<li>Assertively mesh</li>
<li>client-centered</li>
<li>niches and covalent networks</li>
<li>Uniquely e-enable</li>
<li>team driven benefits</li>
<li>rather than exceptional</li>
<li>architectures Continually</li>
<li>foster cutting-edge</li>
<li>open-source core</li>
<li>process-centric</li>
</ul>
</div>推荐指数
解决办法
查看次数
使用 div 更改 Active Slick Carousel
我们使用光滑的轮播，这样我们<div class='item__wrapper'>一次只能显示一张幻灯片。下面是三个items，单击 后item，应该更新光滑的轮播。
问题
- 当用作
item__boxes轮播时slick，我们所有的样式都搞乱了，所以我们不能这样做$('.item__boxes).slick({}); - 当单击 中的第一个、第二个或第三个时
item，item__boxes始终item__wrapper设置为slide 3
问题
- 我们如何设置才能使其
item__boxes在点击时item符合我们的目标？例如，单击第二张item将item__boxes设置item__wrapper为第二张幻灯片。
目标/预期结果：
- 单击第一个
item，将第一张幻灯片设置为活动幻灯片item__wrapper - 单击第二张时
item，将第二张幻灯片设置为活动幻灯片item__wrapper - 单击 Third 时
item，将第三张幻灯片设置为活动幻灯片item__wrapper 1-3不做就完成所有目标$('.item__boxes).slick({});
代码：
$('.item__wrapper').slick({
infinite: true,
speed: 1500,
dots: false,
prevArrow: false,
nextArrow: false
});
$('.item__boxes').on('click', function() {
var slickIndex = $(this).attr('data-slick-index');
$('.item__wrapper').slick('slickGoTo', slickIndex); …推荐指数
解决办法
查看次数
如何使用flexbox将四列包装成两列两列？
我们正在使用flexbox并尝试以下内容.目标是在移动断点上每个项目有一列,在平板电脑断点上有两列,在桌面断点上有四列.
该示例仅使用了四个项目,但是假设我有5个或6个项目,那么我只是希望项目具有响应性.如果行只有足够的空间来显示每行2个项目,那么我希望每个项目继续移动到它上面的行下面.
怎么能实现这一目标？
.flex-row {
display: flex;
@media screen and (min-width: 768px) {
flex: 1;
flex-direction: row;
justify-content: space-between;
}
}
.flex-col {
margin: 6px;
padding: 16px;
background-color: black;
display: flex;
justify-content: center;
align-items: center;
flex: 1;
flex-direction: column;
color: white;
} <div class="flex-row">
<div class="flex-col">Assertively negotiate interoperable portals without cross functional process improvements. Dramatically incentivize tactical best practices with.</div>
<div class="flex-col">Seamlessly grow competitive.</div>
<div class="flex-col">Distinctively optimize user-centric mindshare vis-a-vis plug-and-play infomediaries. Seamlessly optimize impactful solutions and enabled infrastructures.</div>
<div …推荐指数
解决办法
查看次数
如何从Id获取子字符串？
我<img>在不同的页面上有以下元素.如何data-uuid使用javascript从所有属性中获取所有属性？
如果只有1个<img>元素或者多于1个元素,它应该能够处理.
页面foo:
$('[data-uuid]').on('click', function() {
alert($(this).attr('data-uuid'));
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src='https://placeimg.com/200/200/animals' data-uuid='123'>
<img src='https://placeimg.com/200/200/animals?t=1526063181645' data-uuid='456'>
<img src='https://placeimg.com/200/200/animals?t=1526063190252' data-uuid='789'>页面栏:
<img src='some-url-5' data-uuid=157>
推荐指数
解决办法
查看次数
单个页面上有多个 FAQPage 精选片段
我们希望使用 JSON-LD 格式以FAQPage的形式添加特色片段。使用 Google 页面概述上的“查看标记”链接FAQPage，我们可以获得下面的示例特色片段。这似乎意味着该页面的所有问题都应该在一个<script>标签中。
我们通过Google 的结构化数据测试工具和丰富结果工具运行了以下内容，它返回了零错误。然而，没有提到它全部在一个script标签中。
问题
如果我们要使用FAQPage特色片段，我们需要使用的正确变体是什么（1 或 2）？
我们尝试了什么
变体 1 - 将所有问题集中在一个script标签中：
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": [{
"@type": "Question",
"name": "What is the return policy?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Most unopened items in new condition and returned within <strong>90 days</strong> will receive a refund or exchange. Some items have a modified return policy noted on the receipt …推荐指数
解决办法
查看次数
连接变量和函数名称
我们要连接函数名称和变量名称。单击<a>标签应发生这种情况。
我们如何连接函数和变量名？
问题：
- 我们收到错误消息fn_dataId（）未定义
所需的输出：
fn_dataId() should be fn_some123();
我们尝试了什么
$(function() {
$('.link').on('click', function() {
console.log('clicked');
var dataId = $(this).attr('data-id');
console.log('data id - ' + dataId);
// What we tried, but didn't work.
fn_dataId();
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a data-id="some123" class="link">
Click here
</a>推荐指数
解决办法
查看次数
标签 统计
html ×6
css ×3
javascript ×3
flexbox ×2
jquery ×2
css3 ×1
html-lists ×1
hyperlink ×1
json-ld ×1
schema.org ×1
slick.js ×1