CCS样式表
一.css样式表
1.样式表分类
1.内联式
<p style="font-size:18px;">This is an apple</p>
2.内嵌样式表
作为一个独立的区域 内嵌在网页里面,必须写在head标签里面
<style type="text/css>
p{text-decoration:underline}
</style>
3.外部样式表
新建一个CSS文件,然后在HTML文件中调用此样式表。在HTML文件中邮件——CSS样式——附加样式表。
二.选择器
1.标签选择器
用标签名直接做选择器
<style type="text/css">
p
{
font-size=14px;
}
</style>
直接作用下面的p标签
<p>GOd is a girl</p>
2.class选择器
class选择器都是以“.”为开头
<head>
<style type="text/css">
.main {
height=24px;
width=18px;
text-align:center;
}
</style>
</head>
<body>
<div class="main"> 调用的class样式。
Day by day
</div>
</body>
3.ID选择器
id选择器都是以"#"开头的
<head>
<style type="text/css">
#main{
width=15px;
}
</style>
</head>
<body>
<div id="main"> 调用的id样式
ones more
</div>
</body>
4.复合选择器
1.用","逗号隔开表示并列
<style type="text/css">
p,span{
width=100px;
height=50px;
}
</style>
2.用空格隔开表示后代
<style type="text/css>
.main p{ /*找到使用main的标签,然后再其下好到p标签,则p标签使用此样式*/
样式
</style>
3.筛选".(英文的点)"
<style type="text/css">
p.sp /*在P标签中的class="sp" 应用该样式*/
{
样式
}
</style>
样式和属性
1.背景和前景
background-color 背景颜色
background-image:url 背景图片
background-attachment-fixed 背景图是固定的
background-attachment-scroll 背景随字体滚动
background-attachment:no-repeat 背景不平铺 /* no-repeat 不平铺 repeat 平铺 repeat-x 横向平铺 repeat-y 纵向平铺
background-position:center 居中显示 /* 背景图居中,设置背景图位置时,repeat必须为 no-repeat
background-position:right top; 图片放到右上角
background-position:left 100px;top 200px; 背景图离左边100像素,离上边200像素(恶意设为负值)。
2.字体
font-family 字体
font-size:12px; 字体大小12像素
font-weight:bold 字体加粗 正常是normal
font-style:italic 字体倾斜 正常是normal
CCS样式表的更多相关文章
- 3、CCS样式表
一.CCS样式表的分类(优先级从低到高): 1.浏览器默认样式表 2.外部样式表:在外部创建的.ccs文件中.使用外部样式表可以使样式应用于多个网页.通过这个方法只需改动一个文件就能改变整个网站的外观 ...
- CCS样式表小结
CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/ 此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控 ...
- CCS基础样式表
一.css样式表 1.样式表分类 1.内联式 <p >This is an apple</p> 2.内嵌样式表 作为一个独立的区域 内嵌在网页里面,必须写在head标签里面 & ...
- CSS样式表分类
1.内联样式表 <p style="font-size:11px;">内联样式表</p> 2.内嵌样式表 写在head标签里 <style typ ...
- 深度理解CSS样式表,内有彩蛋....
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- CSS样式表
CSS样式及属性 样式标的基本概念 样式表的分类 1.内联样式表 和html联合显示,控制精确,但可重用性差,冗余多. 例:<p style="font-size:14px;" ...
- CSS样式表基础
CSS的样式表其实就是美观页面的,加一些样式. 一.样式表的三种分类: ①内联样式:写在某一个标签里面的样式. 优点:控制精确. 缺点:代码重用性差.(太多了不好写)页面代码乱.(太乱,后期不方便看) ...
- 深入理解脚本化CSS系列第四篇——脚本化样式表
× 目录 [1]CSSStyleSheet [2]CSSRule 前面的话 关于脚本化CSS,查询样式时,查询的是计算样式:设置单个样式时,设置的是行间样式:设置多个样式时,设置的是CSS类名.脚本化 ...
- CSS:CSS样式表及选择器优先级总结
我们在写网页的时候经常会遇到同一个HTML文件,使用了外部样式.内部样式以及内联样式,那么如果发生冲突时浏览器是怎么抉择的呢? 也会遇到这样的情况,在样式表中,对同一个HTML元素,我们有可能既用到了 ...
随机推荐
- 如何设计一个优秀的API(转)
到目前为止,已经负责API接近两年了,这两年中发现现有的API存在的问题越来越多,但很多API一旦发布后就不再能修改了,即时升级和维护是必须的.一旦API发生变化,就可能对相关的调用者带来巨大的代价, ...
- JS 获取元素当前的样式信息
HTMLElement.prototype.__defineGetter__("currentStyle", function () { return this.ownerDocu ...
- 背景虚化 Google Camera App Nokia Refocus HTC One M8 的 Duo景深相机
背景虚化是单反中一种比较常见的拍照形式,参看 http://www.techbang.com/posts/%2017842 https://refocus.nokia.com/
- CentOS配置本地yum源(使用镜像iso文件)
本人在使用yum安装软件的时候,感觉最不爽的是网络不佳时,安装的速度特别慢.所以,个人就上网search了一下如何使用Linux的安装文件作为其yum源.经过几次尝试,已经可以成功的配置了.下面是详细 ...
- BurpSuite抓App数据包的方法
软件准备: 1.猎豹wifi 2.BurpSuite或者fillder都可以 查看电脑IP地址: 网卡ip: 确保无线网卡的IP和手机的代理IP保持一致即可
- window系统查看端口被哪个进程占用了
C:\netstat -aon|findstr 8080TCP 127.0.0.1:80 0.0.0.0:0 LISTENING 2448端口被进程号为2448的进程占用,继续执行下面命令:C:\ta ...
- AOP静态代理解析2-代码织入
当我们完成了所有的AspectJ的准备工作后便可以进行织入分析了,首先还是从LoadTimeWeaverAwareProcessor开始. LoadTimeWeaverAwareProcessor实现 ...
- 《DSP using MATLAB》示例Example5.4
- 树状数组+STL FZU 2029 买票问题
题目传送门 题意:中文题面 分析:隔了一个考试周再做,开始没有什么思路,感觉能用线段树/树状数组维护,树状数组维护最小值不会去写线段树,结果超时.后来发现只要维护前缀几个人以及用优先队列/set维护最 ...
- Android客户端性能测试(一):使用APT测试Android应用性能
一.APT介绍: APT:Android Performance Testing Tools,适用于开发自测和定位性能瓶颈,帮助测试人员完成[性能基准测试.竞品测试]. APT提供了CPU利用率实时曲 ...