<!DOCTYPE html>

 <html>

   <head>

     <meta charset="utf-8">

     <title>CSS常用属性</title>

     <style media="screen">

     /*标签+ 空格 + 大括号 = 标签选择器 ，可在标签选择器中定义标签属性*/

        .d23 {

          color: white;

          font-size: 30px;

          background-color: orange;

          width: 300px;

          height: 60px;

          border:2px red solid;/*第一个参数：边框宽度 第二个参数：边框颜色 第三个参数：边框样式*/

          background-image: url("myImage.png");

          opacity: 0.9;/*透明度*/

          text-align: center;

        }

        p {

          color:blue;

        }

        .p1 {

          text-decoration: overline;

          color: green;

        }

        .p2 {

          text-decoration:line-through;;

          color: red;

        }

        ul {

          list-style: circle;/*列表样式*/

        }

        a {

          text-decoration: none;/*a标签样式（是否存在下划线）*/

        }

        .div {/*盒模型*/

          background-color: gold;

          width: 200px;

          height: 200px;

          border: 20px solid black;

          margin: 50px;/*margin:外边距，相当于左上角的坐标*/

          padding: 10px;/*padding:content 距离 border的距离，会增大整个div大小*/

          /* border, margin,padding都可以-出来上下左右的分别值*/

        }

     </style>

   </head>

   <body>

 <!--  可以在单个div块中的style属性中添加font color等属性，不过一般不推荐，高耦合-->

     <!-- <div class="" style="font-size:30px;color:blue;"> -->

     <div class="d23" >

       这有一个div

     </div>

 <a href="">a标签-点击跳转</a>

 <!--  标签被class赋值后，相当于添加了一个标识符属性，在head中条用相应的标签时要 ‘.’出来相应的属性;

 注意被赋值开头不能是数字，否则不识别-->

     <p class="p1">

       p1标签的文本

     </p>

     <p class="p2">

       p2标签的文本

     </p>

 <ul>

   <li>HTML5</li>

   <li>iOS</li>

   <li>CSS</li>

 </ul>

 <div class="div">

 div

 </div>

   </body>

 </html>

 <!--  1、元素选择器：标签种类名 +空格 +大括号

 eg：

 h1 {

 background-color : #ccc;

 }

 -->

 <!--  2、选择器的分组（可用来选择多个标签）：标签种类名 + ‘,’ + 空格 + 大括号

 eg:

 h1,h2 {

 background-color : #ccc;

 }

 -->

 <!--  3、通配符选择器（可选择全部标签，通常用来去掉外边框，内边框）： '*' + 空格 + 大括号

 * {

 }

 -->

 <!--  4、class选择器：点 + class名 + 空格 + 大括号

 eg：

 .p2 {

   color: red;

 }

 -->

 <!-- 5、结合元素选择器（标签和class相结合，用来精准获取某一个标签）

 eg:

 div.div {

 background-color : #ccc;

 }-->

 <!--  6、id先择器（类似class用法）：‘#’ + id名 + 大括号

 eg：

 #p1 {

 color:red;

 }

 -->

 <!--注意： id 和 class都有标志符的作用，但是区别在于class可以在不同种类标签中使用同一个名称；

 id在不同种类标签中也存在唯一性，即在一个html页面中只能存在一个id-->

HTML5要点_CSS（三）的更多相关文章

  1. 老李分享：《Linux Shell脚本攻略》 要点（三）

    老李分享:<Linux Shell脚本攻略> 要点(三)   1.生产任意大小的文件 [root@localhost dd_test]#[root@localhost dd_test]# ...

  2. SDR软件无线电知识要点（三）EVM

    SDR软件无线电知识要点(三)EVM 信号质量如何评估 Noise Figure (NF) or sensitivity and Error Vector Magnitude (EVM) provid ...

  3. HTML5实现动画三种方式

    编者注:作者以一个运动的小车为例子,讲述了三种实现HTML5动画的方式,思路清晰,动画不仅仅是canvas,还有css3和javascript.通过合理的选择,来实现最优的实现. PS:由于显卡.录制 ...

  4. HTML5/CSS3 第三章页面布局

    页面布局 1 页面组成 2 布局相关的标签 <div></div> 定义文档中的分区或节 <span></span> 这是一个行内元素,没有任何意义 & ...

  5. HTML5学习笔记三 HTML元素、属性、标题、段落简介

    一.HTML 元素 HTML 元素以开始标签起始 HTML 元素以结束标签终止 元素的内容是开始标签与结束标签之间的内容 某些 HTML 元素具有空内容(empty content) 空元素在开始标签 ...

  6. 【C#】第3章学习要点（三）--常用类和结构的用法

    分类:C#.VS2015 创建日期:2016-06-19 使用教材:(十二五国家级规划教材)<C#程序设计及应用教程>(第3版) 一.DateTime结构和TimeSpan结构 DateT ...

  7. 2016.6.20 计算机网络复习要点第三章之CSMA/CD协议

    1.最早的以太网是将许多计算机都连接到一根总线上: (1)总线的特点是:当一台计算机发送数据时,总线上的所有计算机都检测到这个数据,这种就是广播通信方式: (2)为了实现在总线上的一对一通信,可以使每 ...

  8. HTML5要点（二）

    <p> <b>今天周一</b>,<span>呵呵呵呵呵...</span> </p> <i>斜体文字</i&g ...

  9. HTML5要点（一）

    一.标签: <!-- -->:注释:cmd +/ <!DOCTYPE html><!--HTML5 专属版本声明标签(表明该页面使用HTML编写),代码最上层--> ...

随机推荐

  1. ScrollView can host only one direct child 解决

    主要是ScrollView内部只能有一个子元素,即不能并列两个子元素,所以需要把所有的子元素放到一个LinearLayout内部或RelativeLayout等其他布局方式让后再在这个layout外部 ...

  2. linux非阻塞的socket EAGAIN的错误处理

    http://blog.csdn.net/tianmohust/article/details/8691644 在Linux中使用非阻塞的socket的情形下. (一)发送时 当客户通过Socket提 ...

  3. 彻底搞懂javascript中的match, exec的区别

    在工作中经常发现一些同学把这两个方法搞混,以致把自己弄的很郁闷.所以我和大家一起来探讨一下这两个方法的奥妙之处吧. 我们分以下几点来讲解: 相同点: 1.两个方法都是查找符合条件的匹配项,并以数组形式 ...

  4. poj 1924 Paths on a Grid(组合数学)

    题目:http://poj.org/problem?id=1942 题意:给定一个矩形网格的长m和高n,其中m和n都是unsigned int32类型,一格代表一个单位,就是一步,求从左下角到右上角有 ...

  5. bzoj2150，poj1422，poj1548

    其实吧,bzoj2150还是比较水的, 在你知道什么是最小路径覆盖的前提下: 最小路径覆盖就是在有向无环图中,每个点只能被一条路径关联,问最少有多少条路能覆盖这个图 方法是,把对于原图每个点我们拆成左 ...

  6. POJ (线段相交 最短路) The Doors

    题意: 一个正方形中有n道竖直的墙,每道墙上开两个门.求从左边中点走到右边中点的最短距离. 分析: 以起点终点和每个门的两个端点建图,如果两个点可以直接相连(即不会被墙挡住),则权值为两点间的欧几里得 ...

  7. [HDU 1695] GCD

    GCD Time Limit: 6000/3000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submiss ...

  8. Java [Leetcode 242]Valid Anagram

    题目描述: Given two strings s and t, write a function to determine if t is an anagram of s. For example, ...

  9. HDU 5285 wyh2000 and pupil

    题意:有一群人,已知某两人之间互相不认识,要把这群人分成两部分,每部分至少一人,且在每部分内没有人互不认识. 解法:图染色.某场bestcoder第二题……看完题觉得是个二分图……完全不会二分图什么的 ...

  10. Swift的字符串String是值类型

    根据<The Swift Programming Language>中文版基于Xcode6.1的文章描述: Swift的 String 类型是值类型.如果创建了新的字符串,那么当其进行常量 ...