Css 层叠样式表 美化页面的小工具

分类:

  内联 (行内)在标签内部以属性的形式呈现,属性名style

内嵌 head标签内以标签形式呈现,标签名style

外部 head标签内 加link标签 引入外部文件 *.css

<link rel="stylesheet" type="text/css" href="file:///D|/SSs/作业/3.12/图标.css" />

link标签

  插入icon图标(加icon图标,路径必须绝对路径)

<link rel="shortcut icon" href="xxx.ico" type="image/x-icon"/>

icon图标

选择器:

  用来找元素,将样式用在标签上。

    标签选择器 .div{}

    id选择器 #id{}

    class选择器.class{}

    并列(加逗号)选择器1,选择器2

    父子(加空格)父选择器  子选择器

       *{}全页面

属性:

  文本:

    text-decoration 文本修饰  (下划线什么的)

    text-indent   缩进

    text-shadow 阴影 1px(水平阴影的位置)1px(垂直) 1px(模糊的距离) # (阴影颜色)

    font-weight字体加粗

    em表一个字大小

  背景:

    background-position: 属性 定义div内图片在div的位置  可以写两个值左右上下

<head>
<style>
#div{
width:100%;
height:111px;
background-image:url();
background-position:34% 0
}
</style>
</head> <body>
<div id="div"></div>
</body>

bg-position

    

    background-size            图片大小 等比缩放

    background:颜色 图片 平铺 位置 大小

总结问题:

  1.text-indent 缩进属性,只能用在块标签上,span之类的行标签不能用

    解决办法:给span加display:inline-block;属性,变为行内块标签。

  2.大div套小div,若父div不设宽高,则他会随着子div的位置移动而改变。

    如margin float属性,写在子div,父div也会移动。

    解决办法:给父div设置边框或定义宽高。

  3.改变<hr/>的颜色

  <hr style="background-color:#ECECEC; border:none; height:1px;" />

  取消边框,设背景色 设高。

Css 分类 属性 选择器的更多相关文章

  1. HTML&CSS基础-属性选择器

    HTML&CSS基础-属性选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源代码 <!DOCTYPE html> <html> & ...

  2. css分类和选择器

    css的分类:内联,内嵌,外部 内联:写在标签里,style=样式,控制精准代码实用性差. 内嵌:嵌在<head></head>里 <style type="t ...

  3. 23----2013.07.01---Div和Span区别,Css常用属性,选择器,使用css的方式,脱离文档流,div+css布局,盒子模型,框架,js基本介绍

    01 复习内容 复习之前的知识点 02演示VS创建元素 03div和span区别 通过display属性进行DIV与Span之间的转换.div->span 设置display:inline   ...

  4. CSS笔记——属性选择器

    1.存在和值(Presence and value)属性选择器这些属性选择器尝试匹配精确的属性值:[attr]:该选择器选择包含 attr 属性的所有元素,不论 attr 的值为何.[attr=val ...

  5. CSS基础--属性选择器、伪类选择器

    属性选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  6. css的属性选择器

    语法说明: 属性选择器需要将对应属性放入到 方括号中  [ ] ,其中包含属性名,标识符(* $ ~ ^ |) 使用说明: [attribute] 例如  [target] 表示 选择带有 targe ...

  7. IE6不支持CSS的属性选择器

    input[type="text"] { width: 50px; } 测试IE6不生效,而IE7以上浏览器则没问题

  8. CSS 选择器之基本选择器 属性选择器 伪类选择器

    CSS 选择器 常见的选择器列表图 CSS选择器笔记 基本选择器 通配符选择器(*) 元素选择器(E) 类选择器(.className)    所有浏览器都支持类选择器,但多类选择器(.classNa ...

  9. css的各种选择器

    一.基本选择器 1. * 通用元素选择器,匹配任何元素 2. E 标签选择器,匹配所有使用E标签的元素 3. .info class选择器,匹配所有class属性中包含info的元素 4. #foot ...

随机推荐

  1. HDU_1398_母函数

    Square Coins Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Tota ...

  2. MVC 数据传递

    public class HomeController : Controller { // GET: Home public ActionResult Index() //控制器名Home下默认的一个 ...

  3. apicloud常用分享方法

    app中经常会有分享的功能,不管是分享商品还是文字还是图片或者是发送给微信好友扣扣好友,一下做一总结. 分享的样式(分享所有的样式模块):MNActionButton. 在apicloud 中添加这个 ...

  4. vfs:结构体对象

    VFS结构体 super_block 存储一个已安装的文件系统的控制信息,代表一个已安装的文件系统:每次一个实际的文件系统被安装时, 内核会从磁盘的特定位置读取一些控制信息来填充内存中的超级块对象.一 ...

  5. Mark Zuckberg: A letter to our daughter

    转自:   http://www.fastcompany.com/3054120/fast-feed/read-mark-zuckerbergs-letter-to-his-newborn-daugh ...

  6. 移动端 配置rem

    <script> function Rem() { var docEl = document.documentElement, oSize = docEl.clientWidth / 7. ...

  7. code runner运行终端的目录设置

    我的github:swarz,欢迎给老弟我++星星 该设置属性为 "code-runner.fileDirectoryAsCwd": true 设置为 true后,终端默认目录为运 ...

  8. 多重循环、缓冲区管理、数组(day06)

    无法预知的数字叫随机数 rand标准函数可以用来获得随机数 为了使用这个标准函数需要包含stdlib.h头文件 srand标准函数用来设置随机数种子 这个函数把一个整数作为种子使用 不同的种子产生的随 ...

  9. Problem 16

    Problem 16 pow(2, 15) = 32768 and the sum of its digits is 3 + 2 + 7 + 6 + 8 = 26.2的15次方等于32768,而这些数 ...

  10. jupyter记事本的安装和简单应用

    1.概述 jupyter记事本是一个基于Web的前端,被分成单个的代码块或单元.根据需要,单元可以单独运行,也可以一次全部运行.这使得我们可以运行某个场景,看到输出结果,然后回到代码,根据输出结果对代 ...