1. css 是一个什么样的角色?
  答:css 负责控制网页的样式。
  扩展:div + css 是经典的网页布局。实现网页内容与表现相分离。

2. css 的使用方式?
  答:1. 内联式:直接在 HTML 标签中使用 style 属性添加 css 样式

<div style="color:red">红色文本</div>

      2. 嵌入式:将 css 样式写在头部的<style>标签内

<head>
<style type="text/css">
p {color: red;}
</style>
</head>
<body>
<p>红色文本</p>
</body>

       3. 外部式:将 css 写在一个单独的外部文件中,然后使用<link>标签引用

<head>
<link href="base.css" rel="stylesheet" type="text/css" />
</head>
<body>
<p>红色文本</p>
</body> base.css 文件:
p {color: red;}

       3种方式的优先级:就近原则

3. css 组成?

  答:选择器 + 样式

  1. 选择器(多个选择器之间用“逗号”隔开)

    1. 标签选择器

p {color: red;}

    2. id 选择器

#test{color:red;}

    3. 类选择器

.test{color:red}

    4. 派生选择器

    TODO

    5. 属性选择器

[title]{color:red}

  2. 样式

    1. 框模型

      

      提示:1. 背景应用于由内容和内边距、边框组成的区域

           2. 增加内边距、边框和外边距不会影响内容区域的尺寸,但是会增加元素框的总尺寸。

    2. 定位

  

学习css(TODO)的更多相关文章

  1. 学习 CSS 样式

    1.CSS浮动  :  http://www.cnblogs.com/zhongxinWang/archive/2013/03/27/2984764.html (1)一个重要结论:           ...

  2. css知多少(2)——学习css的思路

    两周之前写过该系列的第一篇,其实当时只是一个想法,这段时间迟迟未更新,是在思考一个解决过程.现在初有成效,就开更吧. 1. 一个段子 开题不必太严肃,写博客也不像写书,像聊天似的写东西是最好的表达方式 ...

  3. 开始学习css

    今天开始学习css:应用一本<HTML5与CSS3网页设计基础> 先学习css样式规则声明. Body{ color:blue} 对应:选择符:{声明属性:声明值}: Background ...

  4. HTML+CSS学习笔记 (6) - 开始学习CSS

    HTML+CSS学习笔记 (6) - 开始学习CSS 认识CSS样式 CSS全称为"层叠样式表 (Cascading Style Sheets)",它主要是用于定义HTML内容在浏 ...

  5. 如何深入学习CSS

    学习CSS有了一定基础后,有的人会觉得好象没有什么学的.因为知道一些基本的理论性的东西.CSS说它容易是因为它的知识点有限.说它难学就在于各浏览器对CSS的支持程度不同.如何深入学习我给出以下几点见意 ...

  6. 【图片版】学习CSS网格布局

    简言 CSS网格布局(Grid)是一套二维的页面布局系统,它的出现将完全颠覆页面布局的传统方式.传统的CSS页面布局 一直不够理想.包括table布局.浮动.定位及内联块等方式,从本质上都是Hack的 ...

  7. 学习CSS的思路(转)

    两周之前写过该系列的第一篇,其实当时只是一个想法,这段时间迟迟未更新,是在思考一个解决过程.现在初有成效,就开更吧. 1. 一个段子 开题不必太严肃,写博客也不像写书,像聊天似的写东西是最好的表达方式 ...

  8. 《学习CSS布局》学习笔记

    近几天做了一个小的企业展示网站.虽然页面是在模板的基础上改的,但改的多了不熟悉CSS也很麻烦.正好我看到了学习CSS布局这个网站,于是补习了一下CSS知识. CSS的显示 CSS的元素分为两类:块级元 ...

  9. 学习css盒子模型

    在这一周,我学习了css,在没有学习css之前,我一直都觉得布局很难,样式特别难调,但是学习了css盒子模型之后我就觉得欸,其实还挺简单的,下面就来看看我学习的css吧. CSS 盒子模型(Box M ...

  10. 学习css常用基本层级伪类属性选择器

    常见的css选择器包含:常用选择器.基本选择器.层级选择器.伪类选择器.属性选择器,其中常用选择器分为:1.html选择符*{}//给页面上所有的标签设置模式:2.类选择符.hcls{}//给clas ...

随机推荐

  1. 【UNR #1】火车管理(主席树)

    [UNR #1]火车管理(主席树) 好好的代码被 \(extra\ test\) 卡常了...我就放一个目前最快的版本吧... 题意简化: 有 \(n\) 个栈,\(m\) 次操作. 将 \(x\) ...

  2. xampp/apache启动失败解决方法

    我的问题是: 9:15:53 AM  [Apache] Error: Apache shutdown unexpectedly.9:15:53 AM  [Apache] This may be due ...

  3. Kubernetes-2--安装部署

    kubernetes的部署方式: 1,kubeadm 2, 二进制安装包部署 条件准备: 1,关闭系统的swap分区 为什么要关闭swap分区,我还没有去看官方的说明,搜索到的答案是 kubernet ...

  4. Java 命令行启动时指定配置文件目录

    java -jar -Xbootclasspath/a:/home/tms/conf    /home/tms/bin/S17-tms.jar 先指定配置文件目录: 再指定jar包路径: 运行clas ...

  5. 命令行下查看python和numpy的版本和安装位置

    命令行下查看python和numpy的版本和安装位置 1.查看python版本 方法一: python -V 注意:‘-V‘中‘V’为大写字母,只有一个‘-’ 方法二: python --versio ...

  6. iOS开发手记-仿QQ音乐播放器动态歌词的实现

    最近朋友想做个音乐App,让我帮忙参考下.其中歌词动态滚动的效果,正好我之前也没做过,顺便学习一下,先来个预览效果. 实现思路 歌词常见的就是lrc歌词了,我们这里也是通过解析lrc歌词文件来获取其播 ...

  7. ArrayList的实现原理

    ArrayList的线性复杂度是1.想确定一个数据,直接通过索引进行访问.实际上这个过程和数组是非常相似的.ArrayList在整个使用过程中,如果想要高效操作,最好设置一个数组的大小.在个数固定的情 ...

  8. 阅读Google Protocol Buffers 指南,整理pb语法

    官方网站: https://developers.google.com/protocol-buffers/docs/proto3 1.简单定义一个Message 类型 pb语法文件以"*.p ...

  9. 【WebAPI No.5】Core WebAPI中的自定义格式化

    介绍 Web API为JSON和XML提供媒体类型格式化程序.框架默认将这些格式化程序插入管道中.客户端可以在HTTP请求的Accept标头中请求JSON或XML. 格式化数据这个东西,其实没有什么最 ...

  10. 用RIPv2实现网络区域的互通

    1.动态路由的分类: DV协议:距离矢量协议 距离矢量:路由器只能够知道邻居路由的信息 LS协议:链路状态协议 链路状态:路由器能够知道所在协议内的所有信息 RIP协议的全程是:路由信息协议(DV协议 ...