как скрыть части элемента поверх другого элемента - PullRequest
Новая
       2

как скрыть части элемента поверх другого элемента

0 голосов
/ 05 августа 2010

Допустим, у меня есть элемент уровня родительского блока, например: 

#parent {
 width: 100px;
 height: 100px;
}

и дочерний элемент примерно так: 

#child {
 width: 100px;
 height: 100px;
 margin-left: 50px;
 margin-top: 50px;
}

и элементы встроены так: 

<div id="parent">
  <div id="child>
  </div>
</div>

Я хочу создать эффект, когда в верхнем правом углу отображается только верхняя левая часть дочернего элемента div. 3 угла детского div полностью исчезли. Как я могу добиться этого, используя только CSS?

1 Ответ

0 голосов
/ 05 августа 2010

Вы пытались использовать переполнение: скрытое в #parent div в сочетании со значениями позиции?

Как то так? 

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<style>
#parent {
 width: 100px;
 height: 100px; 
 background-color:#FFCCFF;
 overflow:hidden;
 position:relative;
}
#child {
 width: 100px;
 height: 100px;
 position:absolute;
 top:50px;
 left:50px;
 background-color:#99CC99;
}
</style>

</head>

<body>
    <div id="parent">
        <p>text</p>
    <div id="child">
            <p>text</p>
    </div>
</div>

</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...