• html入门级标签以及常用css


    1、移动字体(走马灯):
    <marquee>写上你想写的字</marquee>

    2、字体加粗:
    <b>写上你想写的字</b>

    3、字体斜体:
    <I>写上你想写的字</I>

    4、字体下划线:
    <u>写上你想写的字</u>

    5、字体删除线:
    <s>写上你想写的字</s>

    6、字体加大:
    <big>写上你想写的字</big>


    7、字体上标:
    一个字<sup>写上你想写的字</sup>

    8、字体下标:
    一个字<sub>写上你想写的字</sub>

    9、图片上飘动的文字特效代码: IE不支持

    <div class="floatIme">
      <marquee scrollamount="11" direction="up" behavior="alternate" height="500px">
        <marquee scrollamount="11" behavior="alternate" width="300px">
        <p>漂浮 的文字</p>
        </marquee>
      </marquee>
    </div>

    通常标签 <strong> 替换加粗标签 <b> 来使用, <em> 替换 <i>标签使用。
      标签的含义:
          <b> 与<i> 定义粗体或斜体文本。
          <strong> 或者 <em>意味着你要呈现的文本是重要的,所以要突出显示。
          <em>--斜体 <mark>--表示高亮的文本内容展示

          <del> 定义删除字 <ins>(下划线)与<del> 一起使用
          <q> 定义短的引用语

    有序列表 ol 里面使用 start="" 定义初始值


    pre 预编译的格式 white-space属性值设置空白区域   http://www.css88.com/book/css/properties/text/white-space.htm

    hr的noshade属性 纯色填充(不建议使用)

    图片的vspace 图片上下间距、 hspace 图片左右间距 属性

    改变你选择中元素的文本的高亮背景和前景色

    ::-moz-selection {
        background: #fe57a1;
        color: #fff;
        text-shadow: none;
    }
    ::selection{
        background: #fe57a1;
        color: #fff;
        text-shadow: none;
    }

    :lang(it) 语法:<p lang="it">lang伪类选择器的使用</p>

    clip 剪切属性 语法clip(上 右 下 左)

    关于IE6下面的问题

    * html,* html body{background-image:url(about:blank);background-attachment:fixed}/*防止IE6下的振动*/
    .ie6fixed {position:absolute;left:expression(eval(document.documentElement.scrollLeft));top:expression(eval(document.documentElement.scrollTop));}
    html>body .ie6fixedLT{position:fixed;left:0;top:0}

    div、img 垂直居中 使用css3的(父元素设置 display:table-cell;vertical-align:middle;)

        position: relative;top:50%;margin:auto;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    或者
        display:block;/*让其具备盒子模型*/
        margin:0 auto; 
        text-align:center;
        margin-top:expression((500 - this.height )/2);/*让IE567垂直对齐 */

    //文字溢出用省略号显示

    p{20%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis;-icab-text-overflow: ellipsis; -khtml-text-overflow: ellipsis;-moz-text-overflow: ellipsis;-webkit-text-overflow: ellipsis;}
    p{20%;overflow : hidden;text-overflow: ellipsis;display: -webkit-box; -webkit-line-clamp: 3/*多少行溢出隐藏*/;-webkit-box-orient: vertical;}

    //换行 CSS

    .wrap{word-break: break-all;word-wrap:break-word;}

    //强制不换行

    .wrapLine{white-space:nowrap;}

    //表格圆角的时候需要设置

    table{border-collapse: separate}

    //透明度

    filter:alpha(opacity=80);opacity:0.8; 

    //通过css3来设置字体的大小,为负数就是倒过来的,针对谷歌最小字体12px进行调整

    .small-font{font-size: 12px;-webkit-transform-origin-x: 0;-webkit-transform: scale(0.9);}

    不常用的一些属性设置

    onpaste="return false"         表示不能粘贴,用于input或不能粘贴的div、span、p标签等
    
    onselectstart="return false" style="-moz-user-select:none;  /*火狐的样式不能选择*/" 不能复制文本内容
  • 相关阅读:
    DHCP服务器搭建
    linux文件通配符
    NTP服务器搭建
    .Net下MoongoDB的简单调用
    Mac 下安装配置MongoDB讲解
    Redis 介绍学习
    PostgreSQL学习之路一 安装
    CentOS安装PostgreSQL
    离线安装PostgreSQL11.6
    PostgreSQL 安装扩展插件plpython3u执行python,访问页面或者第三方程序
  • 原文地址:https://www.cnblogs.com/houzhao/p/5782857.html
Copyright © 2020-2023  润新知