zoukankan      html  css  js  c++  java
  • 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);

  • 相关阅读:
    Unique Binary Search Trees 解答
    Unique Paths II 解答
    Unique Paths 解答
    Maximum Subarray 解答
    Climbing Stairs 解答
    House Robber II 解答
    House Robber 解答
    Valid Palindrome 解答
    Container With Most Water 解答
    Remove Duplicates from Sorted List II 解答
  • 原文地址:https://www.cnblogs.com/tinghao/p/9891842.html
Copyright © 2011-2022 走看看