• 字体、文本、背景、列表样式和超链接（2）

    1.字体样式
    font-size:字体大小
    font-family:字体类型
    font-weight:字体粗细
    font-style:字体倾斜
    font:倾斜 粗细 大小 类型

       

    <html>
    <head>
    </head>
    <style type="text/css">
    body{font-family:Times, "Times New Roman","楷体"}
    h2{font-size:24px;font-style:italic;}
    h2 span{font-style:oblique;font-weight:normal;}
    p{font-size:12px;}
    p span{font-weight:bolder;}
    p span{font:oblique bold 18px "楷体"}1
    </style>
    <body>
    <h1>京东商城——全部商品分类</h1>
    <h2><span>图书、音像、电子书刊</span></h2>
    </body>
    </html>

    		  


    2.文本样式
    color:颜色
    text-align:文本水平对齐方式(left/center/right)
    text-indent:首行缩进(em/px)
    text-decoration:修饰线（underline/overline/line-through）
    line-height:行高
    vertical-align:垂直对齐方式（用于td中）(top/middle/bottom)
    3.超链接为类
    a:link:表示没有访问
    a:visited:表示被访问
    a:hover:鼠标悬浮
    a:active:鼠标按下来松开
    编写顺序：link>visited>hover>active

       

    <html>
    <head></head>
    <style type="text/css">
    img {border:0px;}
    p {font-size:12px;}
    a {
    color:#000;
    text-decoration:none;
    }
    a:hover {
    color:#B46210;
    text-decoration:underline;
    }
    span{
    cursor:pointer;
    }
    </style>
    <body>
    <p><a href="#"><img src="icon.jpg"/></a></p>
    <p><a href="#">xxxxxxxx</a></p>
    <p><span>500g*2</span></p>
    </body>
    </html>

    		  


    4.背景样式
    background-color:背景颜色
    background-image:url(图片路径)：背景图片
    background-repeat:图片平铺（no-repeat/repeat/repeat-x/repeat-y）
    background-position:图片位置(x,y/x%,y%/center left right/top center bottom)
    简单方式：background：颜色 图片 位置 平铺方式
    5.列表样式
    list-style-type:列表样式
    list-style-image:url(图片路径)
    list-style-position:位置（inside/outside）
    list-style:样式 图片 位置
  • 相关阅读:
    设置android:supportsRtl=&quot;true&quot;无效问题
    使用 Docker/LXC 迅速启动一个桌面系统
    快速部署Python应用：Nginx+uWSGI配置详解
    链表源代码（C语言实现）
    delete
    Linux与Unix shell编程指南(完整高清版).pdf
    数据挖掘python,java
    shops
    如何用Excel打开CSV文件
    svn迁移到git
  • 原文地址：https://www.cnblogs.com/yang82/p/6847224.html
Copyright © 2020-2023  润新知