• HTML_css3美化网页元素


    一.span标签:能让某几个文字或者某个词语凸显出来
    <p>
    今天是11月份的<span>第一天</span>,地铁卡不打折了
    </p>

    二.字体风格

    font-family:字体类型
    font-size:字体大小
    font-style:字体风格
    font-weight:字体粗细
    font: 风格 粗细 大小 类型;
    三.文本样式

    color 设置文本颜色 rgb(0,0,255),rgba(0,0,255,0.5)
    text-align 设置元素水平对齐方式
    text-indent 设置首行文本的缩进
    line-height 设置文本的行高
    text-decoration 设置文本的装饰
    vertical-align 设置文本垂直方式
    text-shadow 设置文字阴影 text-shadow: 颜色 x轴偏移位置 y轴偏移位置 模糊半径
    四.超链接伪类
    单击访问前
    .class01:link{
    color: green;
    text-decoration: none;
    }
    单击访问后
    .class02:visited{
    color: pink;
    text-decoration: none;
    }
    鼠标悬浮
    .class03:hover{
    color: aqua;
    text-decoration: none;
    }
    单击未释放
    .class04:active{
    color: red;
    text-decoration: none;
    }
    五.列表样式
    list-style-type 列表项前图标
    list-style-image 列表项前图片
    list-style-image:url(../image/QQ图片20181101095555.png);

    六.背景样式
    background-color 设置背景颜色
    background-image 设置背景图像
    background-repeat 设置图像是否平铺
    background-position 设置背景图像位置
    background: 背景颜色 背景图像 x轴偏移位置 y轴偏移位置 平铺;
    七.渐变
    IE浏览器是Trident内核,加前缀:-ms-
    Chrome浏览器是Webkit内核,加前缀:-webkit-
    Safari浏览器是Webkit内核,加前缀:-webkit-
    Opera浏览器是Blink内核,加前缀:-o-
    Firefox浏览器是Mozilla内核,加前缀:-moz-

    background: -webkit-gradient(linear,left bottom,right top,from(red),to(blue));
    background: linear-gradient(to bottom left,red,black);

  • 相关阅读:
    MYSQL中replace into的用法
    实时监听输入框值变化的完美方案:oninput & onpropertychange
    从0到1,Java Web网站架构搭建的技术演进
    WebApi接口安全认证——HTTP之摘要认证
    南京理工大学第八届程序设计大赛(校外镜像)题解报告
    LeetCode Unique Binary Search Trees II
    还在用ListView?
    网络机顶盒项目总结
    MongoDB之索引
    mac使用git管理Github
  • 原文地址:https://www.cnblogs.com/tinghao/p/9891842.html
Copyright © 2020-2023  润新知