<!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. Android TextView结合SpannableString使用

    super.onCreate(savedInstanceState); TextView txtInfo = new TextView(this); SpannableString ss = new ...

  2. 【HDOJ】4336 Card Collector

    概率DP的题目,一直就不会做这类题目.dp[s]表示状态为s的时候再买多少张牌可以买全,表示的是一个期望值.dp[s] = 1 + P(empty) * dp[s] + P(had) * dp[s] ...

  3. IE9 表格错位bug

    最近做项目的时候,出现一个只在原生IE9(非模拟)下的bug. bug图片如下: 以上两个模块的html代码和样式都是一样的,然而下面的显示却出现了各种对齐的bug. 用IE9的调试器查看,代码完全一 ...

  4. bzoj1453

    这是一道好题,按行建线段树,每个点维护上下边界的连通性,详细见代码注释 网上写法不一,自认为比较简单,就放出来相出来献丑吧 ..,..] of longint; //u[]上边界,d[]下边界 s,f ...

  5. Repeater实例应用

    在实际开发过程中,涉及到数据绑定,分页,以及一对多展示数据时,遇到这样的需求我们怎么解决呢?下面以帖子展示来逐一说明. 帖子主要由两部分组成,第一部分是发帖人的原创内容部分,第二部分是用户评论部分,这 ...

  6. UVa 1642 (综合) Magical GCD

    题意: 给出一个数列,求一个连续的子序列,使得MGCD(i, j) =  该子序列的长度(j-i+1) × 子序列的gcd 最大,并输出这个最大值. 分析: 感觉可能要用优先队列,但貌似也用不上. 但 ...

  7. 常用WEB服务器的特点介绍

    经过系统的学习web服务器,现在知道常用的web服务器的优缺点,这对搭建网站架构时选择使用web服务器很有帮助,现在我简单总结一下: 1. Apache:属于重量级web服务器(重量级主要是在软件包的 ...

  8. LeetCode Implement Trie (Prefix Tree) （实现trie树3个函数：插入，查找，前缀）

    题意:实现trie树的3个功能,只含小写字母的串. 思路:老实做即可! class TrieNode { public: TrieNode* chd[]; bool flag; // Initiali ...

  9. xss(跨站脚本攻击)，crsf(跨站请求伪造)，xssf

    我们常说的网络安全其实应该包括以下三方面的安全: 1.机密性,比如用户的隐私被窃取,帐号被盗,常见的方式是木马. 2.完整性,比如数据的完整,举个例子,康熙传位十四子,被当时四阿哥篡改遗诏:传位于四子 ...

  10. 【转】Android中visibility属性VISIBLE、INVISIBLE、GONE的区别

    原文网址:http://blog.csdn.net/chindroid/article/details/8000713 在Android开发中,大部分控件都有visibility这个属性,其属性有3个 ...