全站通知：

帮助:CSS教程

来自bilibili游戏中心 - WIKI
跳到导航 跳到搜索
丨前言
  • 本文主要内容转载自CSS菜鸟教程
  • 为了降低专业性让更多没有代码基础的同学理解，本教程会结合Wiki当前常用的一些应用场景进行讲解，如有错误，欢迎指出


丨CSS简介
  • CSS指的层叠样式表 (Cascading Style Sheets)
  • 样式定义如何显示HTML元素，通俗一点就是可以让我们的Wiki上的各种图片和文字变成我们想要的样子 变得好看！


丨CSS的语法

CSS语法组成分为三大块

  • 第一：选择器，Wiki内使用最多的是class选择器，需要以 . 号开头，至于名字可以自己随意取，这里我取名 ziti1
  • 第二：属性，这里第一个属性为color(颜色)，第二个属性为font-size(字体大小)
  • 第三：值，color的值为red（红色），font-size值为15px
  • 多个值需要用分号;进行隔开
  • 请勿使用中文模式输入符号 ；和 ｛ ｝
.ziti1
{
    color:red;
    font-size:15px; 
}
  • 也可以这么写，取决于个人风格，但属性多了可能会导致头晕
.ziti1 {color:red;font-size:15px;}
  • 比如这样
.biaoti {border: none;font-family: "Microsoft YaHei";font-size: 20px;color: #fff;margin: 3px 0 5px;padding-left: 35px;padding-right: 60px;font-weight: bold;height: 36px;line-height: 36px;display: flex;align-items: center;flex-wrap: wrap;background-image:url(https://patchwiki.biligame.com/images/thtud/7/73/ii8t12jaxs3xfjx25mr3x2gk54bpyig.png),url(https://patchwiki.biligame.com/images/thtud/8/89/tsvlpeo5dj9agtulat2ixcw94xpj9d6.png),url(https://patchwiki.biligame.com/images/thtud/f/f3/2rkmtymgdjpla74vzgcyinxja4bjdo2.png);
丨如何创建CSS
取自“https://wiki.biligame.com/wiki/index.php?title=帮助:CSS教程&oldid=13307”