我们第一天说了简单的HTML,第二天说了简单的CSS.那么今天.咱们就来说一说他们的结合如何使用吧!

首先说引用方式,和使用方法吧!
　　1.内部样式表.(放入<head>中)

 <head>

     <style>

         div{

4                 color:red:

5     }

     </style>

 <head>

[提示]:红色区域是样式,和元素选择器　

　2.内联样式表(写在标签里的样式)

<p style="color: red;"></p>

注意:语法一定要是style =""双引号里面的属性和属性值哦!

　　3.外部样式表(引入外部CSS样式表)最好也是放在head里面

 <head>

         <link rel="stylesheet"  href="xxx.css">
　　</head>

注意:其中"stylesheet" //样式表

　　href //地址

　　xxx.css中的xxx就是文件名,并且是你自定义的文件名!(后缀名.css不能改哦!)

还有就是CSS选择器!选择器是CSS样式表中重要的组成部分

CSS选择器

　　1.元素选择器

div,p,span,hr,等等很多直接用元素接花括号的 都是元素选择器

　　2.ID选择器(id)

我们在样式表中用id属性值修改标签属性,样式.

语法:

 <div id="div_id">

 //div_id    id属性和属性值

 </div>

 //在style里使用

 //用法 ID选择器开头必须有#

 <style>

     #div_id{

              width:100px;//div 宽100像素

              height:100px;//高100像素
　　　　　　　　　　background:red;//背景颜色是红色;

 }

 </style>

然后呢,他的效果就是这样的:

今天就写这么多吧!然后呢..........我打算弃坑了!因为 我的讲师说 我们要写点高大上的东西 不要写基础了!所以 我就果断弃坑了!以后有时间 我再继续更这个吧!!!

CSS 简单了解(二)的更多相关文章

  1. CSS标签选择器(二)

    一.CSS选择器概述 1.1.CSS功能 CSS语言具有两个基本功能:匹配和渲染 当浏览器在解析CSS样式时,首先应该确定哪些元素需要渲染,即匹配哪些HTML元素,这个操作由CSS样式中的选择器负责标 ...

  2. 前端学习日记之HTML、CSS 简单总结

    前端学习日记之HTML.CSS 简单总结 标签(空格分隔): html css 前端学习日记 html超文本标记语言 一. h标题标签 h1-h7 <!DOCTYPE html> < ...

  3. css进阶之二：flex弹性布局

    布局模式是指一个盒子与其兄弟.祖先盒的关系决定其尺寸与位置的算法.css2.1中定义了四种布局模式,分别是块布局.行内布局.表格布局.以及定位布局.css3引入了新的布局模式Flexbox布局,灵活度 ...

  4. iOS开发UI篇—Quartz2D简单使用(二)

    iOS开发UI篇—Quartz2D简单使用(二) 一.画文字 代码: // // YYtextview.m // 04-写文字 // // Created by 孔医己 on 14-6-10. // ...

  5. css3 calc()：css简单的数学运算-加减乘除

    css3 calc():css简单的数学运算–加减乘除 多好的东西啊,不用js,一个css就解决了. .box{ border:1px solid #ddd; width:calc(100% - 10 ...

  6. 使用C语言实现二维,三维绘图算法(3)-简单的二维分形

    使用C语言实现二维,三维绘图算法(3)-简单的二维分形 ---- 引言---- 每次使用OpenGL或DirectX写三维程序的时候, 都有一种隔靴搔痒的感觉, 对于内部的三维算法的实现不甚了解. 其 ...

  7. HTML与CSS简单页面效果实例

    本篇博客实现一个HTML与CSS简单页面效果实例 index.html <!DOCTYPE html> <html> <head> <meta charset ...

  8. CSS简单使用

    CSS简单使用 标签 : 前端技术 CSS(Cascading Style Sheet : 层叠样式表单)用来定义网页显示效果. 可以解决HTML代码对样式定义的重复,提高后期样式代码的可维护性,并增 ...

  9. css简单的一些基础知识

    css层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言.CSS不仅可 ...

随机推荐

  1. AJAX做增删改查详细！

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. smarty的缓冲

    首先在main文件夹里面建一个文件 huancun.php   然后在template文件夹里面建一个文件 huancun.html   huancun.php中的内容为: require(" ...

  3. final修饰的变量是引用不能变还是对象的内容不能变？

    int a=1;此时a是变量: StringBuffer a=new StringBuffer();此时a就是引用变量,可以说是a引用String对象,通过a来操作String 对象 final St ...

  4. day01课程回顾，数据类型

    Day01 Python的分类 Cpython:代码àc字节码->机器码   一行一行的编译执行 Pypy:   代码àc字节码->机器码   全部转换完再执行 其他python  代码- ...

  5. 进程间通信系列 之 消息队列函数(msgget、msgctl、msgsnd、msgrcv)及其范例

    进程间通信系列 之 概述与对比   http://blog.csdn.net/younger_china/article/details/15808685  进程间通信系列 之 共享内存及其实例   ...

  6. eclipse 创建maven模块

    先创建一个聚合模块. 勾选Create a simple project 点击finish . 看到已经创建好了这个聚合. 接下来我们创建子模块.pay-hk  pay-web 两个字模块,前面一个是 ...

  7. haproxy安装配置for mysql负载均衡（ubantu）

    1.安装pcre apt-get update (apt-get install openssl libssl-dev  ==>可能需要安装的依赖包) apt-get install libpc ...

  8. JS第二弹:用Jquery组装html标签,输出到页面

    用Ajax从服务端获取数据,遍历到表格中(其实将表格替换了),中间发现不能为新增的元素绑定事件,原来是没有将其作为JQ对象

  9. 简单jQuery 实现手风琴菜单

    简单jQuery 实现手风琴菜单 css代码 如下: *{ margin: 0; padding: 0; } #accordion{ width: 500px; } #accordion>div ...

  10. （jquery+ajax）省市区三级联动（封装和不封装两种方式）-----2017-05-14

    首先,要实现如下图效果, 1.要理清思路: 先做出三个下拉菜单----根据第一个下拉菜单的value值获取第二个下拉列表的内容,第三个同理. 2.用到的数据库表:Chinastates表 规律:根据国 ...