Question

如何使用css计算屏幕高度并使用返回值进行宽度计算？它有可能吗？

Request request = db.Requests;
var selectedIdList = new List<string>(arrId);
if (arrId.Length > 0)
{
   for (var item = 0; item <= selectedIdList.Count() - 1; item++)
   {
      var detailId = Convert.ToInt32(selectedIdList[item]);

      request = request.Where(y => y.Id == detailId);
   }
}

Answer 1

是的，在css中有一个名为vh（视口高度）和vw（视口宽度）的东西。视口是屏幕。

myClass {    
  height: calc(50% - 33.5px);
  width:  calc(100vh * 1.3);
}

Answer 2

关于CSS，甚至不可能，在javascript上你不会有任何问题，我建议使用其他变量值，例如相对于窗口宽度的width: 100vw，{{1}相对于窗口高度，height:100vh和max-width: & min-width:与max-height: & min-height:或width:50%您的元素会自动调整大小并具有限制。您还可以利用与父亲相关的height:50%和::after等元素，例如边界三角形。

如果您要提供更多信息，我们可以找到问题的确切代码。

使用javascript执行此操作的方法可以像这样

＆＃13;

::before

＆＃13;

 // onresize event for responsive
document.getElementsByTagName("BODY")[0].onresize=function(){
  
  element = document.getElementById("you_element");
  element.style.height = 'calc(50% - 33.5px)';
  calculateHeight = parseInt(element.clientHeight) * 1.3 
  element.style.width = calculateHeight + 'px'
  
  document.getElementById("width").innerHTML = calculateHeight;
  document.getElementById("height").innerHTML = element.clientHeight;
}
 
  
 // onload page for one set
 document.getElementsByTagName("BODY")[0].onload=function(){
   
   element = document.getElementById("you_element");
   element.style.height = 'calc(50% - 33.5px)';
   calculateHeight = parseInt(element.clientHeight) * 1.3 
   element.style.width = calculateHeight + 'px'
  
   document.getElementById("width").innerHTML = calculateHeight;
   document.getElementById("height").innerHTML = element.clientHeight;
}

＆＃13;

.myclass{
       background-color:#e1e1e1
}

＆＃13;

CSS calc宽度和高度值

2 个答案: