Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/38.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 如何在不影响嵌套div默认大小的情况下更改div?_Html_Css_Angularjs - Fatal编程技术网

Html 如何在不影响嵌套div默认大小的情况下更改div?

Html 如何在不影响嵌套div默认大小的情况下更改div?,html,css,angularjs,Html,Css,Angularjs,我正在用angularjs创建一个web应用程序,我需要您的帮助来解决css问题。 我有几个嵌套的div。我想要一个嵌套的div(我在解释中称之为“myDiv”)来填充整个屏幕。 但是“myDiv”的这个配置不应该影响他的嵌套子级div 下面是一个非常简单的例子: <div> <div> <div class="myDiv"> ... <div> ...


我正在用angularjs创建一个web应用程序,我需要您的帮助来解决css问题。
我有几个嵌套的
div
。我想要一个嵌套的
div
(我在解释中称之为“myDiv”)来填充整个屏幕。
但是“myDiv”的这个配置不应该影响他的嵌套子级
div


下面是一个非常简单的例子:

<div>
   <div>
      <div class="myDiv">
         ...
         <div>
            ...
            <div>...</div>
            ...
         </div>
         ...
      </div>
   </div>
</div>

...
...
...
...
...
“…”指随机内容

默认情况下,“myDiv”内的
div
将具有默认宽度/高度。(我没有为它们放置任何css,因此这些宽度/高度值将由父级“myDiv”的大小决定)
我希望这些默认值完全相同,但我希望“myDiv”填充整个屏幕
与填充一样,但不改变屏幕显示,因此不是填充。

你有没有办法只使用CSS或angularjs来实现这一点


提前感谢

检查此
位置:绝对或固定
可以帮助

.myDiv{
位置:绝对位置;
排名:0;
左:0;
宽度:100%;
身高:100%;
背景色:#F5;
}

此处有一些内容-此文本将被隐藏
...
...
...
...
...
您可以试试这个

`<div>
 <div>
 <div class="myDiv">
 <div>
 <p>Lorem Ipsum is simply dummy text of the printing and typesetting       industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
     </div>
      <div><p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p></div>
  </div>
  </div>
  </div>`

使用Position Absolute将从文档流中删除div,您可以调整其大小以填充整个视口。

此选定div是否需要比其他div更宽,或者这只是为了添加100%宽的背景或其他内容。我尝试以不同的方式修改“myDiv”的所有父级
div
。问题是,我不知道该怎么做,而不是改变parent
div
css。我还在几个论坛上搜索一个可能的解决方案。我发现了很多关于这个的话题,但并不完全是我想要的。Paulie_D,100%的宽度会自动改变子div和显示的大小。事实上,“myDiv”将用于在用户单击此分区时取消选择项目。“myDiv”具有特定的控制器,因此我无法将取消选择事件放在更高的分区上。我希望在屏幕的任何位置触发取消选择事件,因此我需要“myDiv”占据所有屏幕“我认为仅使用CSS是不可能的。也许我错了。@Mtoypc这不是我要问的。它是否真的需要是浏览器的100%宽度(即内容将从一侧延伸到另一侧**),还是仅仅是一种视觉效果?谢谢,但它不起作用。“myDiv”中的内容大小会发生变化。(第一个嵌套的
div
的内容在屏幕中的位置比以前更多)使用您给我的两个解决方案,我将从:传递到。很难看出两幅图像之间的差异,但是当我们从一幅图像传递到另一幅图像时,我们可以看到第二幅图像比第一幅图像大一点(只看这些图像的宽度,高度是好的)。
div.myDiv{
position: absolute;
top: 0%;
bottom:0%;
left: 0%;
right: 0%;
background-color: #f4f4f4;
}