css中网页的高度远低于显示器的高度,如果让#myfooter显示在页面的底部?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了css中网页的高度远低于显示器的高度,如果让#myfooter显示在页面的底部?相关的知识,希望对你有一定的参考价值。

我弄了一个简单的网页,该页面只有三行字,该页面有一个div id="footer"我想问一下如果把这个footer弄到屏幕的最下面~

参考技术A 首先到jquery.com下载jquery并引入页面
var left = ($(window).width() - $("#footer").width()) / 2;
var top = $(window).height() - $("#footer").height();
$("#footer").css("position","absolute");
$("#footer").css("top", top);
$("#footer").css("left", left);
参考技术B 最好不要用绝对定位。
建议:在<div id="footer"></div>上面加入<div style="clear:both; height:0px; line-height:0px; font-size:1px"></div>这样就可以再底部了本回答被提问者采纳
参考技术C <div style='position:absolute;bottom:0px;'>asdfsfad</div>
footer的样式设为我写的这种
这样的话这个div就会一直在网页的最底下了

Swift - UIStackView - 如果所有项目的高度低于阈值,则隐藏

【中文标题】Swift - UIStackView - 如果所有项目的高度低于阈值,则隐藏【英文标题】:Swift - UIStackView - hide if height of all items is below threshold 【发布时间】:2021-09-13 14:29:41 【问题描述】:

我有UIStackView 以垂直模式填充UIButtons。我有动态屏幕调整大小,如果堆栈视图中的所有按钮的高度都低于某个阈值,我想隐藏它们。如何自动实现?

我已尝试扩展UIButton 并添加:

override func layoutSubviews() 
    super.layoutSubviews()
    self.isHidden = (self.frame.height < 20)

这可行,但是一旦按钮被隐藏,它将永远不会重新出现,并且永远不会回调layoutSubviews(即使高度应该再次更大)。

【问题讨论】:

您的堆栈视图是否设置为distribution = .fillEqually,所以所有按钮的高度都相同?您需要设置.isHidden,还是设置.alpha = 0.0 / .alpha = 1.0 是一个合适的选项? (带有.alpha = 0.0 的按钮接受触摸。) @DonMag 是的,所有按钮的高度都相同。将alpha 设置为零是有问题的,因为按钮是透明的,基于一些其他信息,当它们再次“出现”时必须重新创建这些信息。但是,如果它是唯一的选择,它是可以做到的。 【参考方案1】:

不清楚你在做什么,或者为什么你说设置按钮的.alpha属性会有问题,但这里有两种方法,都使用UIStackView子类和处理显示/隐藏layoutSubviews().

1:计算按钮高度将是多少并设置.isHidden属性:

class MyStackView: UIStackView 
    
    override init(frame: CGRect) 
        super.init(frame: frame)
        commonInit()
    
    required init(coder: NSCoder) 
        super.init(coder: coder)
        commonInit()
    
    func commonInit() -> Void 
        axis = .vertical
        distribution = .fillEqually
        spacing = 8
    
    override func layoutSubviews() 
        super.layoutSubviews()

        // approach 1
        //  setting .isHidden
        let numViews = arrangedSubviews.count
        let numSpaces = numViews - 1
        let h = (bounds.height - (spacing * CGFloat(numSpaces))) / CGFloat(numViews)
        let bHide = h < 20
        arrangedSubviews.forEach  v in
            v.isHidden = bHide
        
        
    
    

    根据按钮高度设置.isHidden属性(简单得多):

    类 MyStackView: UIStackView

     override init(frame: CGRect) 
         super.init(frame: frame)
         commonInit()
     
     required init(coder: NSCoder) 
         super.init(coder: coder)
         commonInit()
     
     func commonInit() -> Void 
         axis = .vertical
         distribution = .fillEqually
         spacing = 8
     
     override func layoutSubviews() 
         super.layoutSubviews()
    
         // approach 2
         //  setting .alpha
         arrangedSubviews.forEach  v in
             v.alpha = v.frame.height < 20 ? 0.0 : 1.0
         
    
     
    

这里有一个示例控制器,可以查看它的使用情况。点击任意位置将在300100 之间切换堆栈视图的高度(按钮在100 处的高度将小于20 点):

class ConditionalStackViewController: UIViewController 
    
    let stackView: MyStackView = 
        let v = MyStackView()
        // so we can see the stack view frame
        v.backgroundColor = .systemYellow
        v.translatesAutoresizingMaskIntoConstraints = false
        return v
    ()
    
    var stackHeight: NSLayoutConstraint!
    
    override func viewDidLoad() 
        super.viewDidLoad()
        
        for i in 1...6 
            let b = UIButton()
            b.setTitle("Button \(i)", for: [])
            b.setTitleColor(.white, for: .normal)
            b.setTitleColor(.lightGray, for: .highlighted)
            b.backgroundColor = .red
            stackView.addArrangedSubview(b)
        
        
        view.addSubview(stackView)
        
        let g = view.safeAreaLayoutGuide
        
        stackHeight = stackView.heightAnchor.constraint(equalToConstant: 300.0)
        
        NSLayoutConstraint.activate([
            stackView.topAnchor.constraint(equalTo: g.topAnchor, constant: 20.0),
            stackView.leadingAnchor.constraint(equalTo: g.leadingAnchor, constant: 20.0),
            stackView.trailingAnchor.constraint(equalTo: g.trailingAnchor, constant: -20.0),
            stackHeight,
        ])
        
        let t = UITapGestureRecognizer(target: self, action: #selector(gotTap(_:)))
        view.addGestureRecognizer(t)
    
    
    @objc func gotTap(_ g: UITapGestureRecognizer) -> Void 
        stackHeight.constant = stackHeight.constant == 300 ? 100 : 300
    


【讨论】:

以上是关于css中网页的高度远低于显示器的高度,如果让#myfooter显示在页面的底部?的主要内容,如果未能解决你的问题,请参考以下文章

DIV CSS 如何让网页中的某DIV自动适应屏幕高度自己变如下图

在ASP中如何令到滚动条隐藏??

怎样让一个div高度自适应浏览器高度

div css布局网页如何实现网页自动适应屏幕高度和宽度

什么是看电脑正确姿势?显示器高度,眼睛更健康

怎么让图片在不同分辨率下都居中?