• css入门


    插入样式表

    1.外部样式表:

    <head>

    <link rel="stylesheet" type="text/css" href="a.css" />

    </head>

    2.内部样式表:

    <head>

    <style type="text/css">

    .......

    </style>

    </head>

    3.内联表

    <p style="color:red;margin:0"></p>

    语法

    css语法由3部分构成:select {property: value}

    如果值为多个单词,则要给值加引号:p {font-family: "sans serif";}

    多重声明:p {text-align: center; color:red;}

    选择器分组:h1, h2, h3, h4, h5, h6 {color: green;}

    继承:body {font-family: Verdana, sans-serif;}所有子元素都从body继承属性

    a.css第一行:@charset "utf-8";

    选择器

    派生选择器:li strong {...}用于选择元素<li><strong>...</strong></li>

    id选择器:#id1 {...}

    类选择器:.class1 {...}

    背景

    背景色:background-color:gray;

    背景图像:background-image:url(/ab/cd/e.gif);

    背景重复:background-repeat:repeat-x|repeat-y|no-repeat;

    背景定位:background-position:center|top|bottom|right|left|50% 50%|100px 200px;

    背景关联:background-attachment:scroll|fixed|inherit;

    文本

    color 设置文本颜色
    direction 设置文本方向。
    line-height 设置行高。
    letter-spacing 设置字符间距。
    text-align 对齐元素中的文本。
    text-decoration 向文本添加修饰。
    text-indent 缩进元素中文本的首行。
    text-shadow 设置文本阴影。
    text-transform 控制元素中的字母。
    unicode-bidi 设置文本方向。
    white-space 设置元素中空白的处理方式。
    word-spacing 设置字间距。

    字体

    font 简写属性。作用是把所有针对字体的属性设置在一个声明中。
    font-family 设置字体系列。
    font-size 设置字体的尺寸。
    font-size-adjust 当首选字体不可用时,对替换字体进行智能缩放。(CSS2.1 已删除该属性。)
    font-stretch 对字体进行水平拉伸。(CSS2.1 已删除该属性。)
    font-style 设置字体风格。
    font-variant 以小型大写字体或者正常字体显示文本。
    font-weight

    设置字体的粗细。

    框模型

    内边距:padding, padding-top, padding-right, padding-bottom, padding-left

    边框:border, border-top, border-right, border-bottom, border-left, ...

    外边距:margin, margin-top, margin-right, margin-bottom, margin-left

    定位

    position: static, relative, absolute, fixed

    float: left, right

    伪类

    a:link {...}

    a:visited {...}

    a:hover {...}

    a:active {...}

    LVHA顺序定义

    使用技巧

  • 相关阅读:
    程序员:不要自称为码农
    SpringBoot对静态资源配置
    LeetCode 572. Subtree of Another Tree(子树)
    LeetCode 437. Path Sum III(统计路径和等于sum的路径数量)
    LeetCode 112. Path Sum(判断路径和是否等于一个数)
    LeetCode 617. Merge Two Binary Trees(归并两棵二叉树)
    LeetCode 226. Invert Binary Tree(翻转二叉树)
    Failure to transfer org.apache.maven.plugins:maven-resources-plugin:pom:2.6 的解决办法
    linux-查询某软件的安装的目录
    WebService概念解释
  • 原文地址:https://www.cnblogs.com/feilv/p/4078216.html
Copyright © 2020-2023  润新知