<pre name="code" class="html">Css 简洁

css 选择器

标签选择器

类选择器

ID选择器

Css 层叠样式表   Cascade Stytle Sheet

css 就像网页的化妆品,让你可以随意的把相同的内容转换成

不一样的外观,把就是给相似的结构以不同的样式。

css+div 是当前最流行的前台美工技术,也是web标准推荐的。

使用样式表css,让p标签进行统一变色

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus?">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
<style type="text/css">
p{
color:red; }
</style>
</head>
<body>
<center>
<h1>Css样式表</h1>
<hr>
<p>
<!--<font color="red"> 白日依山尽,</font><br>-->
白日依山尽,<br>
黄河入海流,<br>
欲穷千里目,<br>
更上一层楼。<br>
</cenetr> </body>
</html> p{
color:red; } 这样就对所有的p标签的问题,统一使用红颜色。 标签选择器: p{font-size:2em;} 类选择器: .开头 .info{background:#ff0;} <!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus?">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
<style type="text/css">
p{
color:red;
font-size:2em;
}
li{
color:blue;
font-size:2em;
}
</style>
</head>
<body>
<center>
<h1>Css样式表</h1>
<hr>
<p>
<!--<font color="red"> 白日依山尽,</font><br>-->
白日依山尽,<br>
黄河入海流,<br>
欲穷千里目,<br>
更上一层楼。<br>
</p> <!--<font color="red"> 白日依山尽,</font><br>-->
<li> 白日依山尽,</li>
<li> 黄河入海流,</li>
<li> 欲穷千里目,</li>
<li> 更上一层楼。</li> </cenetr> </body>
</html> <!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus?">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
<style type="text/css">
p{
color:red;
font-size:2em;
}
li{
color:blue;
list-style:none;
font-size:2em;
}
.first{
color:red;
}
</style>
</head>
<body>
<center>
<h1>Css样式表</h1>
<hr>
<p>
<!--<font color="red"> 白日依山尽,</font><br>-->
白日依山尽,<br>
黄河入海流,<br>
欲穷千里目,<br>
更上一层楼。<br>
</p> <!--<font color="red"> 白日依山尽,</font><br>-->
<li class=first> 白日依山尽,</li>
<li> 黄河入海流,</li>
<li> 欲穷千里目,</li>
<li> 更上一层楼。</li> </cenetr> </body>
</html> ID选择器: #third{
color:green;
} <!--<font color="red"> 白日依山尽,</font><br>-->
<li class=first> 白日依山尽,</li>
<li> 黄河入海流,</li>
<li id="third"> 欲穷千里目,</li>
<li> 更上一层楼。</li> 组合选择器:
												

CSS简介和CSS选择器的更多相关文章

  1. 【CSS简介、基础选择器、字体属性、文本属性、引入方式】前端小抄(2) - Pink老师自学笔记

    [CSS简介.基础选择器.字体属性.文本属性.引入方式]前端小抄(2) 本学习笔记是个人对 Pink 老师课程的总结归纳,转载请注明出处! 一.CSS简介 CSS 的主要使用场景就是布局网页,美化页面 ...

  2. 2、前端--初见前后端交互、CSS简介、基本选择器、组合选择器、属性选择器、分组与嵌套、伪类选择器

    今日内容概要 初窥后端框架 css简介 css选择器 今日内容详细 初次体验前后端交互 # 代码无需掌握 只看效果即可 """后端框架:可以简单的理解为别人写好的一个非常 ...

  3. CSS简介,基础选择器,字体属性,文本属性

    欢迎大家去博客冰山一树Sankey,浏览效果更好.直接右上角搜索该标题即可 博客园主页:博客园主页-冰山一树Sankey CSDN主页:CSDN主页-冰山一树Sankey 前端学习:学习地址:黑马程序 ...

  4. form表单,css简介,css选择器,css样式操作

    form表单 简介 表单在Web网页中用以让访问者输入数据,当提交表单时,表单中输入的数据被打包传递给Web服务器端的程序 以处理,从而使得Web服务器与用户之间具有交互功能. 表单实现前后台交互:用 ...

  5. css简介以及css的添加方法

    什么是css? CSS是Cascading Style Sheets的简称,CSS是用来美化网页中文称为层叠样式表,用来控制网页数据的表现,可以使网页的表现与数据内容分离. css的基本语法 1.选择 ...

  6. CSS 简介、 选择器、组合选择器

    #CSS 装饰器引入<!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...

  7. Bulma CSS - 简介

    Bulma CSS框架教程 Bulma CSS – 简介 Bulma CSS – 开始 Bulma CSS – CSS类 Bulma CSS – 模块化 Bulma CSS – 响应式 Bulma是什 ...

  8. CSS 简介、语法、派生选择器、id 选择器、类选择器、属性选择器

    CSS 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与表现 ...

  9. 1 CSS简介&语法&选择器及优先级&背景&文本&字体&链接&列表&表格

    什么是CSS? Cascading Style Sheets层叠样式表,样式定义如何显示HTML元素 样式通常存储于样式表中,外部样式表通常存储在CSS文件中 多个样式定义可层叠为1,样式对网页中元素 ...

随机推荐

  1. OpenCV 安装

    OpenCV 安装 一.环境说明: 操作系统:window10 opencv版本是:VERSION3.1 二.安装过程: [1]官网下载:http://opencv.org/downloads.htm ...

  2. mysql 表及其列字符集设置

    --修改表的字符集 alter table rtb_media_daily_report character set gbk; --查询表列字符集 show full columns from rtb ...

  3. Linux 环境下 fork 函数和 exec 函数族的使用

    前言 接触 Linux 已经有几个月了,以前在网上看各路大神均表示 Windows 是最烂的开发平台,我总是不以为然,但是经过这段时间琢磨,确实觉得 Linux 开发给我带来不少的便利.下面总结一下学 ...

  4. python成长之路10

    断点续传   python2.7 多继承  py35多继承   socketserver源码     支持并发处理socket   i/o多路复用   上节回顾     socket          ...

  5. 转: seajs手册与文档之 -- 快速参考 ( ~~useful )

    目录 快速参考 seajs.use seajs.config define require require.async exports module.exports 快速参考 该页面列举了 SeaJS ...

  6. mybatis用logback日志不显示sql的解决办法

    mybatis用logback日志不显示sql的解决方法 1.mybatis-config.xml的设定 关于logimpl的设定值还不支持logback,如果用SLF4J是不好用的. 这是官方文档的 ...

  7. Spring 3 调度器示例 —— JDK 定时器和 Quartz 展示

    Spring框架提供了执行和调度任务的抽象,支持线程池或者在应用服务器环境中代理给CommonJ. Spring也集成了支持使用JDK Timer和Quartz调度库提供的Quartz Schedul ...

  8. php调用com组件配置 以openoffice为例

    什么是com组件? COM构架下,人们可以开发出各种各样的功能专一的组件,然后将它们按照需要组合起来,构成复杂的应用系统.COM与语言,平台无关的特性使所有的程序员均可充分发挥自己的才智与专长编写组件 ...

  9. delphi DCC32命令行方式编译delphi工程源码

    本文链接地址:http://blog.csdn.net/sushengmiyan/article/details/10284879 作者:苏生米沿 Borland出品的Delphi,在TIOBE公布的 ...

  10. [HDU 1973]--Prime Path(BFS,素数表)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1973 Prime Path Time Limit: 5000/1000 MS (Java/Others ...