小编dip*_*pas的帖子

JavaScript 在 2 个函数之间切换

我想在我的网页中的两个功能之间切换,但我不知道如何...

代码:

<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <link rel="stylesheet" type="text/css" media="screen" href="/css/style.css"/>
    <title>My Project</title>

    <script>
        function openNav() {
            document.getElementById("mySidenav").style.width = "250px";
            document.getElementById("main").style.marginLeft = "250px";
            document.body.style.backgroundColor = "rgba(0,0,0,0.4)";
        }

        function closeNav() {
            document.getElementById("mySidenav").style.width = "0";
            document.getElementById("main").style.marginLeft = "0";
            document.body.style.backgroundColor = "white";
        }
    </script>
</head>
<body>
    <div id="main">
        <div class="head">
            <span class="openbtn" id="navbtn" onclick="openNav(); closeNav(); ">?</span>
            <p> Do Re Mi Fa So Laa</p>
        </div>
    </div>
    <div id="mySidenav" class="sidenav">
        <a href="javascript:void(0)" class="openbtn" onclick="closeNav()">?xx</a>
        <a href="#">About</a>
        <a href="#">Services</a>
        <a href="#">Clients</a>
        <a href="#">Contact</a>
    </div>
</body> …
Run Code Online (Sandbox Code Playgroud)

javascript

1
推荐指数
1
解决办法
5610
查看次数

不透明度与叠加div

SS

我目前正在处理"叠加弹出",当我点击某个按钮时会出现.

它运作得很好,但是我很努力 opacity

我的主要叠加层div出现在整个网站上,我给它一个opacity,这样你就可以看到它的页面background.

在叠加层上我放了一个内容div,显示了实际内容(在这种情况下是密码更改请求).

反正,我不希望内容框是透明的,但不管我什么(z-index:10,opacity:1,position:relative等),这是行不通的.

它仍然是透明的,因为我opacity在叠加div中设置了它.

这是代码:

CSS:

.changePasswordOverlay
{
    height: 0%;
    width: 100%;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color:#fafafa;
    opacity: 0.9;
    overflow-y: hidden;
    transition: 1s;
}

.passwordOverlayContent {
    margin-left:40%;
    margin-top:15%;
    font-family:'source_sans_proregular';
    font-size:15px;  
    position:relative;
}
Run Code Online (Sandbox Code Playgroud)

HTML:

   <div class="changePasswordOverlay">
        <div class='passwordOverlayContent'>
        .
        .
        .
        </div>
    </div>
Run Code Online (Sandbox Code Playgroud)

html css overlay opacity

1
推荐指数
1
解决办法
3503
查看次数

Bootstrap全宽设计

我想要div像下面的图像样式.

在此输入图像描述

我设计了一些但不完整width,它还在移动视图中显示了侧滚动.

请告诉我如何完整地完成它width.

我的HTML代码

#news_and_cv {
  background: #e6e6e6;
}
#send_cv {
  background: #e6e6e6;
  padding: 25px 0px 20px 0px;
}
#news {
  background: #02bed4;
  padding: 25px 0px 20px 0px;
}
.submit {
  padding: 13px 20%;
  background: #02bed4;
  color: #fff;
  text-transform: uppercase;
  font-size: 18px;
  letter-spacing: 1.5px;
  border: 1px solid #fff;
  text-align: center;
  margin-top: 30px;
}
.submit:hover {
  background: #02bed4;
}
.form-style {
  display: block;
  width: 80%;
  height: 37px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: …
Run Code Online (Sandbox Code Playgroud)

html css twitter-bootstrap twitter-bootstrap-3

1
推荐指数
1
解决办法
97
查看次数

如何在css3中选择任何属性等于红色的元素?

如果我想要所有div具有data-color相同属性的s red,我就能做到

div[data-color='red']
Run Code Online (Sandbox Code Playgroud)

但是,如果我想要任何元素,那data-color等于red什么呢?

我该怎么写呢?

css css-selectors css3

1
推荐指数
2
解决办法
64
查看次数

如何在不使用 Flexbox 的情况下水平对齐元素?

有没有办法在不使用Flexbox. 我知道它是一个很棒的工具,但不幸的是它不适用于 IE 9 或 10。我希望链接内的文本显示在图像旁边。JSFiddle 显示了工作代码,但是使用 FlexBox,如何在不使用 Flexbox 的情况下实现这一点?

代码:

<display:setProperty name="paging.banner.full" value='<span class="pagelinks"> <a href="{1}"> <img src="../images/integration/FastLeft.jpg"/> </a> <a href="{2}"> <img src="../images/integration/SlowLeft.jpg"/> </a> | Page {5} of {6} | <a href="{3}">  <img src="../images/integration/SlowRight.jpg"/> </a> <a href="{4}"> <img src="../images/integration/FastRight.jpg"/> </a></span>'/>
        <display:setProperty name="paging.banner.first" value='<span class="pagelinks"> <img src="../images/integration/FastLeft.jpg"/> <img src="../images/integration/SlowLeft.jpg"/> | Page {5} of {6} | <a href="{3}"> <img src="../images/integration/SlowRight.jpg"/> </a> <a href="{4}"> <img src="../images/integration/FastRight.jpg"/> </a></span>'/>
        <display:setProperty name="paging.banner.last" value='<span class="pagelinks"> <a href="{1}"> <img src="../images/integration/FastLeft.jpg"/> </a> <a href="{2}"> <img src="../images/integration/SlowLeft.jpg"/> …
Run Code Online (Sandbox Code Playgroud)

html css cross-browser internet-explorer-9 internet-explorer-10

1
推荐指数
1
解决办法
8233
查看次数

更改一个表类的 th、td 标签的 CSS 会更改所有其他表

我正在尝试调整一组表类的填充,但我正在应用的更改出现在所有其他表上。这是我的CSS:

.my_table th, td{
   font-size: 14px;
   padding-bottom: 2em;
}
Run Code Online (Sandbox Code Playgroud)

这是该表的相关 html:

<table border="1" class="dataframe table my_table">
  <tbody>
    <tr>
      <th>somethingsomething</th>
      <td>somethingsomething</td>
    </tr>
    <tr>
      <th>somethingsomething</th>
      <td>somethingsomething</td>
    </tr>
Run Code Online (Sandbox Code Playgroud)

html css html-table

1
推荐指数
1
解决办法
1644
查看次数

CSS无法正常工作或更改图像大小

谁能告诉我什么是错我的CSS 这里

码:

#contact {
  height: 50%;
  length: 50%;
}
Run Code Online (Sandbox Code Playgroud)
<div id="contact">
  <a href="http://amazon.com/">`
       <img src="http://i.imgur.com/GMldHhn.jpg" />
    </a>
</div>
Run Code Online (Sandbox Code Playgroud)

无论是我是盲人还是我完全忘记了CSS,但这必须是最简单的CSS,但它不起作用.图像尺寸完全没有减少.这不会影响身高.即使我改50%10px仍然没有做任何事情.而我似乎无法弄明白.

html css

0
推荐指数
1
解决办法
245
查看次数

在HTML中水平显示文章元素

如何设置article元素水平显示; 内联而不是垂直,一个在另一个之下?

html css html5 css3

0
推荐指数
1
解决办法
197
查看次数

如何在Bootstrap 3中为不同的设备设置不同的列

我正在Bootstrap3中设计一个网页.

该页面有6个缩略图.

  • 对于桌面,我想每行显示3个缩略图(2行);
  • 对于平板电脑,每行2个缩略图(3行);
  • 对于手机,每行只有一个缩略图(6行,垂直堆叠).

Bootstrap3中是否有一组简单的类来完成此任务.我不想为不同的设备隐藏/显示不同的块.我希望这是真正的响应,并希望列从3列折叠到2列到单个列,因为浏览器width减少.

这可能吗?

html css twitter-bootstrap twitter-bootstrap-3

0
推荐指数
1
解决办法
3462
查看次数

为什么媒体查询最大宽度不起作用?

我想使用媒体查询控制我的徽标的大小.

width我的徽标原件是210px.

我希望它166px在屏幕width大于56.865em和小于此时相同时width,即移动网站.

我为此编写了以下代码:

@media only screen and (min-width: 56.875em){
  .site-branding img{
    max-width: 166px;
  }
}

@media only screen and (max-width: 56.875em){
  .site-branding img {
    max-width: 166px !important;
  }
}
Run Code Online (Sandbox Code Playgroud)

只有第一个代码块正在运行.为什么不是第二次工作?(当屏幕宽度减小时,width徽标210px再次变为).

有没有你不能同时使用任何规则minmax媒体查询,以控制相同的元素?

html css wordpress css3 media-queries

0
推荐指数
1
解决办法
2146
查看次数