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元素,我们有可能既用到了 ...
随机推荐
- Java学习笔记(四)——流程控制语句
一.条件语句 1.if条件语句 (1)语法: if(条件) { 条件成立时的代码 } (2)执行过程 2.if else语句 if(条件) { 条件成立时的代码 } else { 不成立的代码 } 3 ...
- MFC GDI绘图基础
一.关于GDI的基本概念 什么是GDI? Windows绘图的实质就是利用Windows提供的图形设备接口GDI(Graphics Device Interface)将图形绘制在显示器上. 在Wind ...
- Hbase原理、基本概念、基本架构
来源:http://blog.csdn.net/woshiwanxin102213/article/details/17584043 概述 HBase是一个构建在HDFS上的分布式列存储系统:HBas ...
- 关于本地存储构成数组以及jquery的inArray方法的使用
for (var i=0, j = _self.sessionStorage.length; i < j; i++){ var key = _self.sessionStorage.key(i) ...
- Thymeleaf模板引擎使用
Thymeleaf模板引擎使用 什么是Thymeleaf Thymeleaf是一个Java库.它是一个XML / XHTML / HTML5模板引擎,能够在模板文件上应用一组转换,将程序产生的数据或者 ...
- DrawingContext.Pop Method
The following example shows the effect of the Pop command. using System; using System.Windows; using ...
- Oracle错误 ORA-12560如何解决
造成ORA-12560: TNS: 协议适配器错误的问题的原因有三个:1.监听服务没有起起来.windows平台个一如下操作:开始---程序---管理工具---服务,打开服务面板, 启动oracleh ...
- [转]Mac 科研常用软件
转自:http://bbs.feng.com/read-htm-tid-7698336.html 我的 Mac 是 2012 年的 Pro Retina,现在主要用的是 Mac 系统,Windows ...
- struts.properties配置详解
Struts 2框架有两个核心配置文件,其中struts.xml文件主要负责管理应用中的Action映射,以及该Action包含的Result定义等.除此之外,Struts 2框架还包含 st ...
- LinearLayout 垂直滚动条
<?xml version="1.0" encoding="utf-8"?> <ScrollView xmlns:android=" ...