CSS快速入门
一.概述
层叠样式表;可以对HTML的元素,进行控制,使HTML的元素展现的效果和位置更好;
二.基本语法
css规则由两个部分构成:选择器和语句
语句规则:
1.css选择器的名称区分大小写;属性名和属性值区分大小写;
2.每条语句的结尾都要使用;,最后一行可以省略;
3.注释格式:/**/
4.css在html中写的代码需要使用style标签包裹起来;
5.如果单独写一个css文件,则不需要使用style标签,所有的语句需要使用大括号包裹起来;
6.如果属性值中包含空格,必须使用双引号包裹起来;
7.如果一个属性名对应多个属性值,多个属性值用空格隔开;
8.css文件的后缀名.css;
三.格式:
选择器{
属性名: 属性值;
属性名: 属性值;
属性名: 属性值;
...........
}
四.选择器
1.ID选择器
#id的属性值{
属性名: 属性值;
属性名: 属性值;
.....
}
2.类选择器
.class属性的属性值{
属性名: 属性值;
属性名: 属性值;
.....
}
3.元素选择器(标签选择器)
标签名{
属性名: 属性值;
属性名: 属性值;
.....
}
4.属性选择器
标签名[属性名=属性值]{
属性名: 属性值;
....
}
5.包含选择器
基本选择器 标签名{
属性名: 属性值;
....
}
四.与html整合的方式
1.在html的head标签中使用link标签
<link rel="stylesheet" type="text/css" href="css/regist-css.css">
2.在html的页面的head标签中使用style标签,在style标签内也可以写css代码;只能该html文件使用,其他html不能用;
3.在开头标签中,写属性名style=”属性名=属性值;属性名=属性值;”;
CSS快速入门的更多相关文章
- CSS快速入门(四)
目录 CSS快速入门(四) 浮动 float属性 clear属性 浮动解决的问题及其影响 解决父标签塌陷的方法 浮动案例 定位 什么是脱离文档流 定位的两种方法 position定位 static定位 ...
- Html与CSS快速入门01-基础概念
Web前端技术一直是自己的薄弱环节,经常为了调节一个简单的样式花费大量的时间.最近趁着在做前端部分的开发,果断把这部分知识成体系的恶补一下.内容相对都比较简单,很类似工具手册的学习,但目标是熟练掌握. ...
- Html与CSS快速入门02-HTML基础应用
这部分是html细节知识的学习. 快速入门系列--HTML-01简介 快速入门系列--HTML-02基础元素 快速入门系列--HTML-03高级元素和布局 快速入门系列--HTML-04进阶概念 示例 ...
- Html与CSS快速入门03-CSS基础应用
这部分是html细节知识的学习. 快速入门系列--HTML-01简介 快速入门系列--HTML-02基础元素 快速入门系列--HTML-03高级元素和布局 快速入门系列--HTML-04进阶概念 边框 ...
- Html与CSS快速入门04-进阶应用
这部分是html细节知识的学习. 快速入门系列--HTML-01简介 快速入门系列--HTML-02基础元素 快速入门系列--HTML-03高级元素和布局 快速入门系列--HTML-04进阶概念 之前 ...
- HTML/CSS快速入门
Web概念 JavaWeb 使用java语言开发基于互联网的项目 软件架构 C/S架构:Client/Server 客户端/服务器 用户本地有一个客户端程序,在远程有一个服务端程序 如QQ,英雄联盟. ...
- #001 CSS快速入门讲解
CSS入门讲解 HTML人+CSS衣服+JS动作=>DHTML CSS: 层叠样式表 CSS2.0 和 CSS3.0 版本,目前学习CSS2, CSS3只是多了一些样式出来而已 CSS 干啥用的 ...
- CSS快速入门例子
CSS入门应用 01-结合方式01 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " ...
- CSS快速入门基础篇,让你快速上手(附带代码案例)
1.什么是CSS 学习思路 CSS是什么 怎么去用CSS(快速上手) CSS选择器(难点也是重点) 网页美化(文字,阴影,超链接,列表,渐变等) 盒子模型 浮动 定位 网页动画(特效效果) 项目格式: ...
- 02-03 CSS快速入门
css四种引入方式:test.html: p{ color: gold; font-size: 20px; } title.html: <!DOCTYPE html> <html l ...
随机推荐
- 获取当前按钮或者html的ID名称
今天做的上传图片,点击图片删除. 随机给图片id,获取图片id,然后删除图片. 由于图片id是随机的,用点击img或者点击class,获取id都不行,最后用onclick事件获取. js代码如下: $ ...
- js 任意元素解绑任意事件的兼容代码
hmtl代码: <input type="button" value="按钮" id="btn"/> <input typ ...
- windows xp 环境下 Oracle8i 双击安装文件无反应的解决办法
今天调试一份比较老的程序,数据库用的是Oracle8i,在本地xp系统上搞了半天,双击安装文件就是没反应! 在网上整理了一下解决办法: 1.将ORACLE软件拷贝到硬盘. (比如我拷贝到:F:\Ora ...
- [软件工程]团队介绍&学长采访
项目 内容 这个作业属于哪个课程 2019春季计算机学院软件工程(罗杰) 这个作业的要求在哪里 第一次团队作业 - 采访! 我们在这个课程的目标是 团队开发,合作学习 1.团队介绍 岗位 人员& ...
- PHP7 关于变量的基本判断
刚学 PHP ,一些基础还不太牢固,边实践边记录. about NULL $class_name = null; 语句结束后,$class_name 是空,没有,什么都没有的“空”.用 is_null ...
- poj1182 食物链 带权并查集
题目传送门 题目大意:大家都懂. 思路: 今天给实验室的学弟学妹们讲的带权并查集,本来不想细讲的,但是被学弟学妹们的态度感动了,所以写了一下这个博客,思想在今天白天已经讲过了,所以直接上代码. 首先, ...
- git命令行使用
* git branch : 查看本地分支 * git branch -r : 查看远程分支 * git branch -a : 查看全部分支 * git branch name : 本地新建分支 * ...
- 设置input placeholder的样式
::-webkit-input-placeholder {/*Chrome/Safari*/ font-family: 'Avenir', Helvetica, Arial, sans-serif; ...
- PHP返回变量或数组的字符串表示:var_export()
使用var_export()函数可以在服务端程序没有在打印的情况下,配合file_put_contents方便的调试程序,查看变量和数组的内容. 在开发过程中,我们常用var_dump()来打印数组内 ...
- Oracle9i之xmltype应用(2)
Oracle 9i提供的XML内置特性: Oracle 9i支持XMLType类型,它是一种Oracle 9i系统定义的对象类型.XMLType有内置的函数,有力的提供了推XML的创建,索检,索引等功 ...