zoukankan      html  css  js  c++  java
  • H5系列一、静态页面总结

    1、img父标签设置高度,如果容器没有设置高度的话,图片会默认把容器底部撑大几像素 -- 大概3px,给容器设置高度。

    2、input标记换行后默认有一个间隙,设置float属性。input标记默认还有边框(2px),清除边框border:none/0。

    3、搜索栏

    <form>

    <input placeholder="SEARCH..." type="text" class="txt"/>
    <input type="button" class="btn" value="">
    </form>

    4、更换li的list-style

    background:url(../images/gt.jpg) no-repeat 5px center;  (通过background-position-x、通过background-position-y调整列表符合的位置

    5、给容器设置text-align:center;可以让图片水平居中

    6、取消表单框默认蓝色边框 outline:none;

    7、overflow:hidden;可以解决margin-top的兼容问题,同时可清除浮动。

    8、导航栏,字数不固定,因此每个li不能设置宽度,通过padding控制间隙。

    9、两种省略号显示,第二种可以让文本显示两行。

    代码:

         280px;
        height: 22px;
        line-height: 22px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        /* 实现p两行省略号显示 */
        
            height: 52px;
        line-height: 28px;
        word-break: break-all;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
            
  • 相关阅读:
    C++--第25课
    C++--第24课
    C++--第23课
    C++--第22课
    C++--第21课
    C++--第20课
    C++--第19课
    C++--第18课
    C++--第17课
    Windows程序设计学习笔记(1):一个简单的windows程序
  • 原文地址:https://www.cnblogs.com/QQ1210611769/p/12090533.html
Copyright © 2011-2022 走看看