中午时间学点css，附带http://www.w3cschool.cc/css/css-tutorial.html这个链接！

中午的时间学了这些东西！如下图:

附带代码：

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>css_1</title>

 </head>

 <style>

 p{

     /*这是设置颜色的*/

 color: red;

   /*这是设置对齐方式的*/

 text-align: center;

 }

 /*CSS Id 和 Class */

 /*HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 "#" 来定义。ID属性不要以数字开头，数字开头的ID在 Mozilla/Firefox 浏览器中不起作用。*/

 #para1

 {

     text-align: center;

     color: red;

 }

 /*class 选择器用于描述一组元素的样式，class 选择器有别于id选择器，class可以在多个元素中使用。*/

 /*class 选择器在HTML中以class属性表示, 在 CSS 中，类选择器以一个点"."号显示：    */

 .center

 {

     text-align: center;

 }

 /*-- 你也可以指定特定的HTML元素使用class。类名的第一个字符不能使用数字！它无法在 Mozilla 或 Firefox 中起作用。 */

 p.center

 {

     text-align:center;

 }

 /*多重样式:如果某些属性在不同的样式表中被同样的选择器定义，那么属性值将从更具体的样式表中被继承过来。/*/

 /*多重样式将层叠为一个:因此，内联样式（在 HTML 元素内部）拥有最高的优先权，这意味着它将优先于以下的样式声明： 标签中的样式声明，外部样式表中的样式声明，或者浏览器中的样式声明（缺省值）。*/

 </style>

 <body>

     <!-- 调用P这个selector -->

     <p>Hello World!</p>

     <p id="para1">Hello World!</p>

     <!-- 在以下两个的例子中，所有拥有 center 类的 HTML 元素均为居中。 -->

     <h1 class="center">标题居中</h1>

     <p class="center">段落居中</p>

     <!-- 在以下实例中, 所有的 p 元素使用 class="center" 让该元素的文本居中: -->

     <p class="center">This paragraph will be center-aligned</p>

     <p style="color: sienna;margin-left: 20px;" > This is a paragraph.</p>

 </body>

 </html>

 /*不要在属性值与单位之间留有空格。假如你使用 "margin-left: 20 px" 而不是 "margin-left: 20px" ，

 它仅在 IE 6 中有效，但是在 Mozilla/Firefox 或 Netscape 中却无法正常工作。*/

 hr{color: sienna;}

 p{margin-left: 20px;}

 body{border-image: url("/images/back40.gif");}

学点css基础的更多相关文章

  1. CSS基础篇之了解CSS和它的基本属性

    CSS是什么? CSS英文全名是Cascading Style Sheets翻译过来就是层叠样式表,它主是把网页表现与内容分离的一种样式设计语言.这种语言能优化我们编程,把东西简化和优化写法,而且不同 ...

  2. 学习笔记（一） HTML+CSS基础课程

    这个周把慕课网的<HTML+CSS基础课程>课程学完,内容都是非常非常基础的,不过还是学到了几个小知识点,记下来先. <a>超链接发送邮件 直接上把他的图片给挪过来了,我就不打 ...

  3. 〖前端开发〗HTML/CSS基础知识学习笔记

    经过一天的学习,把慕课网的HTML/CSS基础知识学完了,笔记整理: 1. 文件结构: HTML文件的固定结构: <html> <head>...</head> & ...

  4. 两天学会css基础（一）

    什么是css?css的作用是什么? CSS 指层叠样式表 (Cascading Style Sheets)主要作用就是给HTML结构添加样式,搭建页面结构,比如设置元素的宽高大小,颜色,位置等等. 学 ...

  5. 第五模块：WEB开发基础 第1章·HTML&CSS基础

    01-前端介绍 02-HTML介绍 03-HTML文档结构 04-head标签相关内容 05-常用标签一之h1~h6,p,a 06-常用标签一之ul.ol.div.img.span 07-常用标签二- ...

  6. 零点起飞学HTML+CSS (顼宇峰) PDF扫描版

    零点起飞学HTML+CSS系统地介绍了网站制作中各种常用的HTML标签和CSS属性,以及网站各个部分和各种布局的实现方法,还提供了大量实例来引导读者学习,力求让读者获得真正实用的知识.本书涉及面广,从 ...

  7. Html+CSS基础之Html

    注:本文摘自慕课网http://www.imooc.com   HTML+CSS基础课程 本人有道笔记:http://note.youdao.com/noteshare?id=18fa811e9f9e ...

  8. css基础—字体那些事

    css基础-字体那些事 1. 首先讲字的大小样式等 字体大小 font-size: 40px; 文字字体 font-family: "宋体",Arial; 文字样式 font-st ...

  9. 0009 CSS基础选择器（ 标签、类、id、通配符）

    typora-copy-images-to: media 第01阶段.前端基础.CSS基础选择器 CSS选择器(重点) 学习目标: 理解 能说出选择器的作用 id选择器和类选择器的区别 应用 能够使用 ...

随机推荐

  1. Azure Site Recovery 通过一键式流程将虚拟机故障转移至 Azure虚拟机

    Ruturaj Dhekane 云 + Enterprise 项目经理  现在,AzureSite Recovery可以通过其"灾难恢复至 Azure"功能保护您的工作负荷,并 ...

  2. 关于Sublime Text2 GBK编码的问题

    很多文章都说需要"ConvertToUTF8"和"GBK Encoding Support"连个插件. 其实GBK Encoding Support完全不需要, ...

  3. T型架构观点学习

    一.成为T型人才 眼界格局思维要尽可能的开阔,并不断横向开阔,专业能力要尽可能专注,并且纵向上不断加深: 互联网的快速迭代开发和扁平化管理,使单纯管理人才的作用越来越小,除了分配任务和项目管理,在其他 ...

  4. Android 开发性能优化之SparseArray(一)

    多数Android开发者都知道在Android中可以使用HashMap来映射一种对应关系,在java开发中HashMap也算是一种很重要的数据存储结构.然后很多人在Android开发中多数都会用Has ...

  5. 【原】本地win7，远程服务器XP系统，两台机器间不能拖动文件

    (1)网上大部分说是rdpclip.exe(存放在c:/windows/system32)的问题,试了好几次,没有解决 (2)通过第二种方式解决,详细步骤如下所示: 1.点击进入远程连接. 2.选择本 ...

  6. Linux查看系统版本信息的

    // 显示电脑以及操作系统的相关信息 uname -a // 正在运行的内核版本 cat /proc/version // 显示的是发行版本信息 cat /etc/issue // 适用于所有的lin ...

  7. Windows Azure公有云服务相关方案

    http://www.cnblogs.com/sennly/p/4139675.html 1.公有云平台服务简介 Windows Azure 是一个灵活而开放的云平台,通过该平台,您可以在数据中心快速 ...

  8. windows下virtualenv使用报错

    virtualenv为python提供了一个独立的虚拟环境,使各种python依赖库的安装相互独立.在家里ubuntu上安装一切正常,但在公司的win7上安装总是报以下错误: "D:\Pro ...

  9. POJ1947 - Rebuilding Roads(树形DP)

    题目大意 给定一棵n个结点的树,问最少需要删除多少条边使得某棵子树的结点个数为p 题解 很经典的树形DP~~~直接上方程吧 dp[u][j]=min(dp[u][j],dp[u][j-k]+dp[v] ...

  10. 问题-[致命错误] Project1.dpr(1): Unit not found: 'System.pas' or binary equivalents (DCU,DPU)

    问题现象:[致命错误] Project1.dpr(1): Unit not found: 'System.pas' or binary equivalents (DCU,DPU) 问题原因:由于删除D ...