CSS中代码格式

CSS是Cascading Style Sheets(层叠样式表)的缩写。是一种对web文档添加样式的简单机制，属于表现层的布局语言。

1.基本语法规范
分析一个典型CSS的语句：

p {COLOR:#FF0000;BACKGROUND:#FFFFFF}
其中"p"我们称为"选择器"(selectors)，指明我们要给"p"定义样式；
样式声明写在一对大括号"{}"中；
COLOR和BACKGROUND称为"属性"(property)，不同属性之间用分号";"分隔；
"#FF0000"和"#FFFFFF"是属性的值(value)。
2.颜色值
颜色值可以用RGB值写，例如：color : rgb(255,0,0)，也可以用十六进制写，就象上面例子color:#FF0000。如果十六进制值是成对重复的可以简写，效果一样。例如:#FF0000可以写成#F00。但如果不重复就不可以简写，例如#FC1A1B必须写满六位。

3.定义字体
web标准推荐如下字体定义方法：

body { font-family : "Lucida Grande", Verdana, Lucida, Arial, Helvetica, 宋体,sans-serif; }
字体按照所列出的顺序选用。如果用户的计算机含有Lucida Grande字体，文档将被指定为Lucida Grande。没有的话，就被指定为Verdana字体，如果也没有Verdana，就指定为Lucida字体，依此类推，；
Lucida Grande字体适合Mac OS X；
Verdana字体适合所有的Windows系统；
Lucida适合UNIX用户
"宋体"适合中文简体用户;
如果所列出的字体都不能用，则默认的sans-serif字体能保证调用;
4.群选择器
当几个元素样式属性一样时，可以共同调用一个声明，元素之间用逗号分隔，： p, td, li { font-size : 12px ; }

5.派生选择器
可以使用派生选择器给一个元素里的子元素定义样式，例如这样：

li strong { font-style : italic; font-weight : normal；}
就是给li下面的子元素strong定义一个斜体不加粗的样式。

6.id选择器
用CSS布局主要用层"div"来实现，而div的样式通过"id选择器"来定义。例如我们首先定义一个层

<div id="menubar"></div>
然后在样式表里这样定义：

#menubar {MARGIN: 0px;BACKGROUND: #FEFEFE;COLOR: #666;}
其中"menubar"是你自己定义的id名称。注意在前面加"#"号。

id选择器也同样支持派生，例如：

#menubar p { text-align : right; margin-top : 10px; }
这个方法主要用来定义层和那些比较复杂，有多个派生的元素。

6.类别选择器
在CSS里用一个点开头表示类别选择器定义，例如：

.14px {color : #f60 ;font-size:14px ;}
在页面中，用class="类别名"的方法调用：

<span class="14px">14px大小的字体</span>
这个方法比较简单灵活，可以随时根据页面需要新建和删除。

7.定义链接的样式
CSS中用四个伪类来定义链接的样式，分别是：a:link、a:visited、a:hover和a : active，例如：

a:link{font-weight : bold ;text-decoration : none ;color : #c00 ;}
a:visited {font-weight : bold ;text-decoration : none ;color : #c30 ;}
a:hover {font-weight : bold ;text-decoration : underline ;color : #f60 ;}
a:active {font-weight : bold ;text-decoration : none ;color : #F90 ;}
以上语句分别定义了"链接、已访问过的链接、鼠标停在上方时、点下鼠标时"的样式。注意，必须按以上顺序写，否则显示可能和你预想的不一样。记住它们的顺序是“LVHA”。

原文链接：https://zhidao.baidu.com/question/123035147.html

@import语法结构
@import + 空格+ url(CSS文件路径地址);

1）、在html中

放在<head>标签里
<style type="text/css">
@import url(CSS文件路径地址);　　　　注意：这里的路径可以是绝对路径或相对路径，也可以是网页链接
</style>

着重说一下绝对路径，必须是形如(file:///D:/这是new2.css文件的父文件夹/new2.css)这样的才能被HTML引用

　　　　　　　　　　@import在html中的使用截图

2）、在css中
直接使用
@import url(CSS文件路径地址);

　　　　　　@import在CSS代码或CSS文件中使用截图

在css和html中均可以使用@import

原文链接：http://www.divcss5.com/rumen/r431.shtml

如果文章对你哪怕有一点点的帮助，麻烦点个推荐或者关注，支持一下创作者！万分感谢！

css中代码格式以及@import的语法结构的更多相关文章

  1. 为什么在CSS中不要再使用@import

    http://www.stevesouders.com/blog/2009/04/09/dont-use-import/为什么在CSS中不要再使用@import

  2. CSS规范 - 代码格式--（来自网易）

    选择器.属性和值都使用小写 在xhtml标准中规定了所有标签.属性和值都小写,CSS也是如此.单行写完一个选择器定义 便于选择器的寻找和阅读,也便于插入新选择器和编辑,便于模块等的识别.去除多余空格, ...

  3. css中：link和@import的区别

    两者都是外部引用css的方式.但是有一定的区别: 1. 从属关系:link是一个xhtml标签,除了加载css外,还可以定义 RSS.rel 连接属性等: @import属于css范畴,只能加载css ...

  4. CSS中的变量使用，var()语法

    参考博客:https://blog.csdn.net/qq_34206361/article/details/53690414

  5. 《阿里巴巴Java开发手册》代码格式部分应用——idea中checkstyle的使用教程

    <阿里巴巴Java开发手册>代码格式部分应用--idea中checkstyle的使用教程 1.<阿里巴巴Java开发手册> 这是阿里巴巴工程师送给各位软件工程师的宝典,就像开车 ...

  6. css中的层叠性及权重的比较

    假如同一个标签被多个选择器选中,每个选择器都设置了相同的样式,浏览器中加载时这个样式听谁的? 不同选择器设置的同一个样式,只会选择一个进行加载,不会叠加. 为了解决听谁的问题,引入层叠性的概念. 层叠 ...

  7. Golang语法与代码格式速记【转】

    // Description: Golang语法与代码格式速记 // Author: cxy // Date: 2013-04-01 // Version: 0.3 // TODO 说明 // TOD ...

  8. CSS中link与import的区别

    一.import的用法 1,在html文件中 <style type="text/css"> @import url(http://www.dreamdu.com/st ...

  9. 【对比分析三】CSS中 link 和@import 的区别

    1).  link 是 XHTML 标签,无兼容问题: @import 是在 CSS2.1 提出的,只有IE5以上才能识别. 2).  语法结构不同. link (链接式)只能放入HTML源码中,语法 ...

随机推荐

  1. 理解UV贴图

    一.理解UV贴图UVs是驻留在多边形网格顶点上的两维纹理坐标点,它们定义了一个两维纹理坐标系统,称为UV纹理空间,这个空间用U和V两个字母定义坐标轴.用于确定如何将一个纹理图像放置在三维的模型表面.本 ...

  2. tar、tgz、gz文件批量解压方法

    我是用for i in $(ls *.tgz);do tar xvf $i;done 批量解压的tgz文件的我是用for i in $(ls *.gz);do gzip -d $i;done批量解压的 ...

  3. [模板]tarjan缩点+拓扑排序

    题目:给定一个n个点m条边有向图,每个点有一个权值,求一条路径,使路径经过的点权值之和最大.你只需要求出这个权值和. 允许多次经过一条边或者一个点,但是,重复经过的点,权值只计算一次. 题目简述:先t ...

  4. 1.oracle dblink(数据库不同实例数据对导)

    .创建一个两个数据库之间的dblink,语法如下 create database link to_test connect to scott identified by tiger using '(D ...

  5. Overflow与块状格式上下文

  6. 使用delphi 开发多层应用（二十一）使用XE5 RESTClient 直接访问kbmmw 数据库

    delphi XE5 出来了,增加了android 的开发支持,另外增加了一个RESTClient 来支持访问REST 服务器. 这个功能非常强大,可以直接使用非常多的REST 服务器.同时也可以支持 ...

  7. Windows sql语句正则匹配导出数据到本地 The MySQL server is running with the --secure-file-priv option so it cannot execute this statement

    尝试使用 into outfile导出数据的时候出现错误: The MySQL server is running with the --secure-file-priv option so it c ...

  8. Xcode6制作动态及静态Framework[repost]

    有没有写SDK或者要将一些常用的工具类做成Framework的经历? 你或许自己写脚本完成了这项工作,相信也有很多的人使用 iOS-Universal-Framework ,随着xCode6的发布,相 ...

  9. Codeforces758D Ability To Convert 2017-01-20 10:29 231人阅读 评论(0) 收藏

    D. Ability To Convert time limit per test 1 second memory limit per test 256 megabytes input standar ...

  10. lambda distinct

    public ActionResult Index() { IList<RegisterModel> regList = new List<RegisterModel>() { ...