3月22 关于CSS
CSS(Cascading Style Sheep 叠层样式表,作用是美化HTML网页)/*注释内容*/ 为注释的方法。
样式表的分类:
1.内联样式表
和HTML联合显示,控制精确,但是可重用性差,冗余较多。
例:<p style="font-size:14px;">内联样式表</p>
2.内嵌样式表
作为一个独立区域内嵌在网页里,必须写在head标签里面。
<style type="text/css">
p //格式对p标签起作用
{
样式;
}
</style>
3.外部样式表
新建一个CSS文件,用来放置样式表。如果要在HTML文件中调用样式表,需要在HTML文件中点右键→CSS样式表→附加样式表。一般用link连接方式。
有些标签有默认的边距,一般写样式表代码的时候都会先去除(也可以设置其他的样式),如下:
<style type="text/css">
{
margin:0px;
padding:0px;
}
选择器
1.标签选择器 用标签名做选择器
p
{
background-color:#0F6;
color:#F6F;
text-decoration:underline;}
以上是采用外部样式表的格式写出了的。
2.class 选择器。都是以“.”开头的
.p
{
text-decoration:underline;
font-family:"Lucida Console", Monaco, monospace, "楷体";
color:#F00;
font-size:30px;} <body> <div class="p">格林童话</div>
</body>
</html>
3.ID选择器 以#开头
#pp
{
font-style:normal;
text-decoration:underline;
color:#03C;
background-size:cover;
} <body> <div id="pp">安徒生童话</div>
</body>
</html>
4.复合选择器
1)用“,”隔开,表示并列
<style type="text/css">
p,span
{
text-decoration:overline;
color:#0ff;
width:100px;
height:60px;
}
</style>
2)用空格隔开 表示后代
.main p
{
background-color:#00F;
font-size:50px;
color:#3F9;}
</style>
3)筛选“.”
p.sp
{
font-style:normal;
text-decoration:underline;
color:#03C;
background-size:cover}
链接的style:
a:link 超链接被点前状态
a:visited 超链接点击后状态
a:hover 悬停在超链接时
a:active 点击超链接时
在定义这些状态时,有一个顺序l v h a
a:link
{
text-decoration:none;
color:#000;}
a:visited
{
text-decoration:none;
color:#000;}
a:hover
{
color:#F00;
text-decoration:underline;}
a:active
{
text-decoration:underline;
color:#C60;}
3月22 关于CSS的更多相关文章
- 2015年10月22日CSS学习笔记
XHTML1.0对HTML4.0的改进 借鉴了XML的写法,语法更加严格. 把页面的内容和样式分离了,废弃了html4中的表示样式的标签和属性.推荐使用css来描述页面的样式. CSS样式的优先级 ! ...
- 12月22日《奥威Power-BI财务报表数据填报》腾讯课堂开课啦
一扇可以通向任何地方的“任意门”,是我们多少人幼时最梦寐以求的道具之一.即使到了现在,工作中的我们还会时不时有“世界那么大,我想去看看”的念头,或者在突然不想工作的时刻,幻想着自己的家门变成了“任意门 ...
- Autodesk 最新开发技术研讨会 -8月22日-Autodesk北京办公室
为了增进与广大中国地区Autodesk产品的二次开发人员的了解与互动,帮助中国地区的Autodesk产品二次开发人员了解Autodesk最新的二次开发技术动向,并获得Autodesk公司专业开发支持顾 ...
- 见见面、聊聊天 - 5月22日晚7点Meetup,三里屯绿树旁酒吧,畅谈云技术和应用
总是邮件.QQ什么的线上聊,让我们见面吧,不怕见光死,呵呵. 我和同事会先抛砖引玉,给大家介绍一下Autodesk几款最新的云技术和解决方案,然后大家就可畅所欲言,自由交流.来自五湖四海的人,为了 ...
- 2016年12月22日 星期四 --出埃及记 Exodus 21:17
2016年12月22日 星期四 --出埃及记 Exodus 21:17 "Anyone who curses his father or mother must be put to deat ...
- 转:[置顶] 从头到尾彻底理解KMP(2014年8月22日版)
[置顶] 从头到尾彻底理解KMP(2014年8月22日版)
- 2016年11月22日 星期二 --出埃及记 Exodus 20:13
2016年11月22日 星期二 --出埃及记 Exodus 20:13 "You shall not murder.不可杀人.
- 2016年10月22日 星期六 --出埃及记 Exodus 19:6
2016年10月22日 星期六 --出埃及记 Exodus 19:6 you will be for me a kingdom of priests and a holy nation.' These ...
- 微软SQL Server认证最新信息(17年5月22日更新),感兴趣的进来看看哟
之前一直有在关注微软认证的一些消息,由于最新的SQL Server认证加入了2016的相关内容,导致课程资料需要大部分更新,但是微软更新相对比较慢,并且经常改版,目前发现的最新的MCP Cert Pa ...
随机推荐
- 好用的js模板
组织form下的 json对象 $.fn.serializeObject = function() { var o = {"unique_id":new Date().getTim ...
- HDU 4825 Xor Sum(01字典树入门题)
http://acm.hdu.edu.cn/showproblem.php?pid=4825 题意: 给出一些数,然后给出多个询问,每个询问要从之前给出的数中选择异或起来后值最大的数. 思路:将给出的 ...
- Scala语言学习
Scala的程序被编译成Java字节码(生成class文件),所以可以运行在JVM上,并且可以调用Java的类库,兼容Java程序. Scala 是一门多范式(multi-paradigm)的编程语言 ...
- 【UOJ#196】【BZOJ4574】[Zjoi2016]线段树
题目链接: http://www.lydsy.com/JudgeOnline/problem.php?id=4574 http://uoj.ac/problem/196 考虑数字随机并且值域够大,我们 ...
- 【三十五】thinkphp之视图
1.模板定义 视图属于mvc中的v.一般是html结合php获取的数据提供给用户使用. 每个模板的文件都是独立的(文件名与控制器名称必须一样) 默认的模板文件规则是视图目录/[模板主题]控制器/操作名 ...
- python字符串用法
一,数据类型的转换 1常用的数据类型有int,str,bool三种; int是整型:一般的操作是查找数据的二进制长度bit_length() 一般数据有: 1)二进制:逢二进一 2)十进制,(0-9) ...
- JavaSE习题 继承接口和泛型
问答题: 1.子类在什么情况下可以继承父类友好成员? 答:在同一个包内 2.子类通过怎样的方法可以隐藏继承的成员变量? 答:声明一个与父类相同变量名的成员变量 3.子类重写继承的方法原则是什么? 答: ...
- TRMM数据在arcgis打开
基本思路:地图配准 1将投影设置为plate carree(world) ,是在投影坐标系统下的世界中选择,当然为了输入坐标方便,设置属性genral中单位为度,显示为度分秒. 2 首先,要知道打开后 ...
- 类似于placehoder效果的图标展示
在做app开发的时候往往会有那个注册登录啊,什么的页面,里面就会包含这那种类似于placeholder的效果的图标,当时我也是和ios和安卓混合开发一款app里面的页面全是我写,最开始就是登陆啊,注册 ...
- 如何模拟一个http请求并把response的内容保存下载下来,导出到excel中(结尾福利)
def doExport(self): # 模拟一个http请求 url = u'%s?dumptype=investigation&dumpid=%s&timezone=8' % ( ...