• 前端学习(二)css样式笔记(笔记)


    background-image:url(img/xiaofeiji.jpg)
    背景图:url(图片路径);(背景图默认平铺)

    background-repeat:repeat-x/repeat-y/no-repeat;
    背景重复状态:x轴/y轴/不重复;

    background-position:100px 10px;---数字写法
    背景图定位:居左100px  居上10px
    background-position:top right;----单词写法

    background-position:center center;-----居中



    背景图缩写:
    background:url(img/xiaofeiji.jpg) no-repeat top left yellow;

    background:背景图片  重复状态  位置  背景颜色;

    ****
    background:背景图片  重复状态  位置;


    讲一些关于文字样式:
        
        color:red;
        字体颜色

        font-weight:bold/normal;(500以上是加粗,500以下变细)
        字体粗细:加粗/变细;

        font-size:14px;(网页中默认的字体大小16px,网页中字体最小是12px)
        字体大小:14px;

        font-family:'微软雅黑';
        字体库:

        font-style:italic/normal;
        字体倾斜:倾斜/不倾斜


        text-decoration:none/underline/line-through/overline;
        文本状态:没有划线/下划线/中划线/上划线;

        text-indent:2em;-----em单位(1em就是一个字的大小)
        文本缩进:2em

            功能:1.文本缩进
                  2.隐藏文字

         text-align:center/left/right;
         文本左右位置:居中/居左/居右


        line-height:65px;
        行高:65px;(如果想让某段文字在100px高度居中那么就写line-height:100px;)




    =================================================
    实体字符:
        空格:   

    ----------------------------------------------

    调试页面:




    -----------------------------------------------
    ps

    挖空一个图片

    快捷键:
        f7 图层
        W    魔棒工具
    步骤:
        1.选中魔棒工具
        2.点击需要挖空区域(系统默认会选中这写区域)
        3.点击按钮delete,删除掉选中的区域
        4.一次重复操作


    图片格式:区别

        jpg   不支持透明 质量较好  新闻图片

        png   支持透明和半透明 质量好 产品图片 logo

        gif      支持透明、不支持半透明 一般  表情 小动态图标

    --------------------------------------------------

    新标签:
        
        b ---默认有加粗效果
        strong----默认加粗效果(语义化功能)

        i----默认是倾斜效果
        em---默认是倾斜效果(语义化功能)

        font-style:italic;

    注意:
        在程序当中,所有有默认样式的标签,都要清除掉它们默认样式!!!


    ===============================================

    继承:
        子级标签可以继承父级标签的字体方面样式!

    写页面的方法:
        1.从大到小
        2.从上到下

  • 相关阅读:
    Gmail总是把MS发来的信作为垃圾邮件
    添加了CSpreadSheet.h后出现LNK2005错误
    弃用Eudora
    卸载Intel C++ Compiler后Visual C++ 6.0不能工作了
    Matlab对多CPU系统的支持
    Borland决定出售Delphi、JBuilder、C++Builder等IDE产品
    微软提供的免费软件
    生命在于运动?
    "Cannot modify header information"的解决方法
    慢慢的,我们长成了受困于数字的大人
  • 原文地址:https://www.cnblogs.com/wxiaoyu/p/9579147.html
Copyright © 2020-2023  润新知