css常用知识
1.基本语法规范
p {color:#ff0000;background:#ffffff}
a.其中"p"称为"选择器"(selectors),指明我们要给"p"定义样式
b.样式声明写在大括号"{}"里
c.color和background称为属性。不同属性用";"隔开
d."#ff0000"和"#ffffff"为属性值
----------------------------------------------------------
2.定义字体
body{font-family:"Lucida Grande",Verdana,Lucida,Arial,Helvetica,宋体,sans-serif;}
字体按照所列出的顺序选用,如果用户的计算机含有Lucida Grande字体,文档就被指定为Lucida Grande
-----------------------------------------------------------
3.群选择器
p,td,li{font-size:12px;}
当几个元素样式属性一样时,可以共同调用一个申明,元素之间用逗号隔开
-----------------------------------------------------------
4.派生选择器
li strong{font-style:italic; font-weight:normal;}
就是给li下面的子元素strong定义一个斜体不加粗的样式
---------------------------------------------------------
5.id选择器
先定义一个层<div id="menubar"></div>
然后在样式表里定义#menubar {MARGIN:0px;background:#fefefe;color:#666;}
其中"menubar"是你自己定义的id名称。注意在前面加"#"号。
id 选择器也支持派生,如#menubar p{text-align:right;margin-top:10px}
这个方法主要是用来定义层和那些比较复杂,有多个派生的元素
-----------------------------------------------------------
6.类别选择器
.name {color:#f60;font-size:14px;}
在页面中class="类别名"的方法调用:<span class="name">测试</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:#c00}
a:hover{font-weight:bold;text-decoration:none;color:#c00}
a:active{font-weight:bold;text-decoration:none;color:#c00}
以上语句分别定义了"链接、已访问过的链接、鼠标停在上方时、点下鼠标时"的样式。注意,必须按以上顺序写,否则显示可能和你预想的不一样
-----------------------------------------------------------
打个小广告:英语爱好者加群:102234283,里面很多老外,可以学学口语
android/ios爱好者加群: 308967142
webapp爱好者加群:339073325
这个app潮流公众帐号主要是推荐给手机用户最近最潮的软件,让大家随时跟上时尚。我们会提供给你们最好的服务,也可以在微信中搜索appchaojiu加入关注,喜欢我们就帮我们推荐吧!
css常用知识的更多相关文章
- css常用知识与用法
1 类选择器就是再 某一个标签后面加上class =“” 然后再到前面去定义这个class 一定要记住前面加. 2 id选择器和类选择器是差不多的 不过id选择器前面不加.而加# ...
- 前端开发:css基础知识之盒模型以及浮动布局。
前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西? 为什么这个浮动没有效果? 这个问题楼主已经回答了n遍.今天则是把 ...
- CSS基本知识和选择器
一.CSS基本知识 内联式css样式,直接写在现有的HTML标签中 内联式css样式表就是把css代码直接写在现有的HTML标签中,如下面代码: <p style="color:red ...
- css基本知识
WANGJUN59451 css基本知识 1.CSS 简介 CSS 指层叠样式表 (Cascading Style Sheets),是一种用来表现 HTML 文档样式的语言,样式定义如何显示 HT ...
- CSS 基本知识
1.CSS 简介 CSS 指层叠样式表 (Cascading Style Sheets),是一种用来表现 HTML 文档样式的语言,样式定义如何显示 HTML 元素,是能够真正做到网页表现与结构分离的 ...
- (转)第一天 XHTML CSS基础知识 文章出处:标准之路(http://www.aa25.cn/div_css/902.shtml)
欢迎大家学习<十天学会web标准>,也就是我们常说的DIV+CSS.不过这里的DIV+CSS是一种错误的叫法,建议大家还是称之为web标准. 学习本系列教程需有一定html和css基础,也 ...
- CSS基础知识之position
最近在慕课网学习了 网页布局基础 和 固定层效果 ,都是由声音甜美的 婧享人生 老师所录制,视频详细讲解了CSS中position的用法,在此把学习笔记分享给大家. CSS定位机制 标准文档流(Nor ...
- <转载>Div+Css布局教程(-)CSS必备知识
目录: 1.Div+Css布局教程(-)CSS必备知识 注:本教程要求对html和css有基础了解. 一.CSS布局属性 Width:设置对象的宽度(width:45px). Height:设置对象的 ...
- CSS基础知识01
一.CSS基础知识介绍 1.css是cascading style sheet层叠式样式表的简写 2.css小用法 加粗:font-weight:bold; 正常用:norma ...
随机推荐
- 三角剖分求多边形面积的交 HDU3060
//三角剖分求多边形面积的交 HDU3060 #include <iostream> #include <cstdio> #include <cstring> #i ...
- 手势冲突UIPanGestureRecognizer 和UIPinchGestureRecognizer
当同时使用pan和pin手势时假如冲突,需要加入下面方法 - (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shou ...
- 【转】webgame前台开发总结--虽然是10年的文章,但是也有参考价值
一.webgame整个游戏流程: 1.预加载(打开游戏页面后,显示进度条,主要加载前期的登陆和创建角色资源,创建角色资源的加载可以放到进入创建角色界面的时候加载,因为玩家除了第一次进入游戏,其他时间基 ...
- ECMAScript 6 入门学习笔记(持续更新)
1.let命令(作用同var) ES6新增了let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效. { let a = 10; var b = 1; } ...
- Percona Xtrabackup备份mysql(转)
add by zhj:另外,参考了Xtrabackup之innobackupex备份恢复详解,我用的是Xtrabackup2.2.6版本, 可以成功备份和恢复指定的数据库. 原文:http://www ...
- Ubuntu下gdb远程调试--warning: Could not load vsyscall page because no executable was specified解决方案
1. 首先安装gdbserver apt-get install gdbserver 2. 编译-g 程序 gcc -g test_gdb.c -o test_gdb 源码如下: #include & ...
- UVALive 7455 Linear Ecosystem (高斯消元)
Linear Ecosystem 题目链接: http://acm.hust.edu.cn/vjudge/contest/127401#problem/B Description http://7xj ...
- SD卡中的命令CMD
SD卡中的命令是SD控制器和SD卡之间的桥梁,它封装了SD卡的实现细节,不影响SD卡中FLASH的读写变更. 命令的长度是48位,它的字段如图: SD校准定义的CMD如下:
- 咏南多层开发框架支持最新的DELPHI 10 SEATTLE
购买了咏南多层开发框架的老用户如有需要提供免费升级. 中间件
- flask中的request对象方法
'accept_charsets','accept_encodings','accept_languages','accept_mimetypes','access_route','applicati ...