CSS基础

1、css简介

cascading style sheets    汉译层叠样式表,WEB标准中的表现标准语言,表现标准语言在网页中主要对网页信息的显示进行控制，简单说就是如何修饰网页信息的显示样式。

2、CSS语法

选择符{属性：属性值；属性：属性值；}

div{width:500px; background:yellow; height:100px; }

说明：

1）每个CSS样式由两部分组成，即选择符和声明，声明又分为属性和属性值；

2）属性必须放在花括号中，属性与属性值用冒号连接。

3）每条声明用分号结束。

4）当一个属性有多个属性值的时候，属性值与属性值不分先后顺序。

5）在书写样式过程中，空格、换行等操作不影响属性显示。

 

3、样式的建立:内部样式   外部样式  和内联样式

内部样式  ：

语法：

<style type="text/css">

/*css语句*/

</style>

注：使用style标记创建样式时，最好将该标记写在<head></head>;

 

4、外部样式的建立及调用

a:外部样式表的创建

b:外部样式表的导入

*方法 一

<link rel="stylesheet" type="text/css" href="目标文件的路径及文件名全称" />

说明：使用link元素导入外部样式表时，需将该元素写在文档头部，即<head>与</head>之间。

*方法二

<style type="text/css">

@import url(目标文件的路径及文件名全称);

</style>

注：@和import之间没有空格 url和小括号之间也没有空格；必须结尾以分号结束；

 

5.内联样式表（行间样式，行内样式，嵌入式样式）

语法：

<tag style="属性：属性值;属性:属性值;"></tag>

6.样式表的作用域

行内样式的作用域是当前标签，内部样式的作用域 是当前文件，外部样式表的作用域是有关联的所有文件。

7.样式表的优先级

内联样式表的优先级别最高

内部样式表与外部样式表的优先级和书写的顺序有关，后书写的优先级别高。

css基础-语法篇的更多相关文章

  1. CSS基础语法与选择器

    CSS基础 语法 : <head> <style type="text/css"> 选择器(即修饰对象){ 修饰属性:属性值; 修饰属性:属性值; } &l ...

  2. Xamarin XAML语言教程基础语法篇大学霸

    Xamarin XAML语言教程基础语法篇大学霸 前  言 Xamarin是一个跨平台开发框架.它可以用来开发iOS.Android.Windows Phone和Mac的应用程序.使用Xamarin框 ...

  3. Scala快速入门 - 基础语法篇

    本篇文章首发于头条号Scala快速入门 - 基础语法篇,欢迎关注我的头条号和微信公众号"大数据技术和人工智能"(微信搜索bigdata_ai_tech)获取更多干货,也欢迎关注我的 ...

  4. CSS基础语法（一）

    目录 CSS基础语法(一) 一.CSS简介 1.CSS语法规范 2.CSS代码风格 二.CSS基础选择器 1.标签选择器 2.类选择器 3.id选择器 4.通配符选择器 5.总结 三.CSS字体属性 ...

  5. HTML+CSS基础(HTML篇)

    引言 在日常开发Android中,很多时候会遇到和WebView打交道,对CSS HTML JS不是很清楚的话是完不成一些功能的,本篇开始学习HTML,文章的主要内容是总结了慕课网中,HTML+CSS ...

  6. 【Java基础总结】Java基础语法篇（上）

    Java基础语法 思维导图 一.Java语言介绍 1.Java应用平台 JavaSE(Java Platform Standard Edition):开发普通桌面和商务应用程序,是另外两类的基础 Ja ...

  7. html标签和css基础语法与浏览器兼容性等相关基础学习

    <!-- table的使用 --> <h3>前端日常</h3> <form action="https://www.baidu.com"& ...

  8. (二)CSS基础语法

    CSS语法规则由两个主要的部分构成:选择器,以及一条或者多条声明. 下面的示意图为您展示了CSS语法结构: 例如: h1{color:red;font-size:14px;} 值得不同写法和单位 其中 ...

  9. CSS从零开始(1)--CSS基础语法

    1.CSS语法 CSS规则有两个主要部分构成:选择器,以及一条或多条说明. 例如:selector{declaration1;declaration2;declaration3;......;} 注: ...

随机推荐

  1. 移动端分享到微信和QQ

    关于在H5页面实现分享到微信和QQ,当初做的时候由于没有做过这方面的功能,也查了很多资料,找了很多插件,试了很多方法,大部分的都是点击后出现一个二维码,这不 符合我的需求,所以在网上找了一个 nati ...

  2. java优雅的使用elasticsearch api

    本文给出一种优雅的拼装elasticsearch查询的方式,可能会使得使用elasticsearch的方式变得优雅起来,使得代码结构很清晰易读. 建立elasticsearch连接部分请参看另一篇博客 ...

  3. scala中的Type使用

    trait Base { val name: String } case class S( name: String, age: Int ) extends Base case class F( na ...

  4. GPUImage库的使用

    GPUImage开源项目地址:https://github.com/BradLarson/GPUImage GPUImage使用说明:https://github.com/BradLarson/GPU ...

  5. 【node】使用nvm管理node版本

    写在前面 nvm(nodejs version manager)是nodejs的管理工具,如果你想快速更新node版本,并且不覆盖之前的版本:或者想要在不同的node版本之间进行切换: 使用nvm来安 ...

  6. win10 UWP 标签

    本文主要翻译:http://visuallylocated.com/post/2015/02/20/Creating-a-WrapPanel-for-your-Windows-Runtime-apps ...

  7. （转）java的动态代理机制详解

    原文出自:http://www.cnblogs.com/xiaoluo501395377/p/3383130.html 在学习Spring的时候,我们知道Spring主要有两大思想,一个是IoC,另一 ...

  8. Servlet 笔记-Cookie 处理

    Cookie 是存储在客户端计算机上的文本文件,并保留了各种跟踪信息. 识别返回用户包括三个步骤: 服务器脚本向浏览器发送一组 Cookie.例如:姓名.年龄或识别号码等. 浏览器将这些信息存储在本地 ...

  9. PHP程序员的技术成长之路规划

    按照了解的很多PHP/LNMP程序员的发展轨迹,结合个人经验体会,抽象出很多程序员对未来的迷漫,特别对技术学习的盲目和慌乱,简单梳理了这个每个阶段PHP程序员的技术要求,来帮助很多PHP程序做对照设定 ...

  10. 动态主机配置协议DHCP

    一.什么是DHCP DHCP,动态主机配置协议,提供一种称为“即插即用连网”的机制,允许一台计算机加入新的网络和获取IP地址而不用手工配置. 二.DHCP工作原理和工作流程 DHCP服务器被动打开UD ...