CSS样式表
|-引入的三种方式
|--内联样式
|----标签内部（空格style）
|--内嵌样式
|----<head></head>标签内部（<style></style>）
|--外联样式
|----<link rel="stylesheet（样式表）" type="text/css" href="css文件路径"/>

<!--外联样式（link：联系）-->

<link rel="stylesheet" type="text/css" href=""/>
<!--内嵌（style:风格、样式）-->

<style type="text/css">

<!--内联-->

<div style=""></div>

|-选择器（查找方式）
|--id 唯一、通过 # 查找
|--class 可以重名、通过 . 查找
|--<标签名> 通过 <标签名> 查找（<div>/<span>：控制所有div/span标签）
|--并列选择  通过 ， 查找（可并列控制不同类型：id，class，<div>，<span>）
|--后代选择  通过 空格 查找(只控制后代的样式)

/*井号#代表id*/

#weiyi{}/*选择id="weiyi"的元素*/

/*.代表class*/

.kechongming{}/*选择所有class="kechongming"的元素*/

/*通过标签名直接控制*/

div{}/*选择所有div*/

span{}/*选择所有span*/

/*并列选择,元素之间加 , */

#weiyi,.kechongming,div,class,span{}

/*空格 选择后代*/

#houdai div{}/*选择id="houdai"的元素中的所有div*/

.houdai_ span{}/*选择所有class="houdai_"的元素中的所有span*/

<!--选择器-->

<div id="weiyi"></div>

<div class="kechongming"></div>

<div class="kechongming"></div>

<div class="kechongming"></div>

<div id="houdai">

　　<div></div>

　　<div></div>

　　<span></span>

　　<span></span>

</div>

|-样式
|-大小  width:宽度 height 高度
|-背景 background-color 颜色
|-背景图片
|--background-image:url("") 图片路径
|--background-size: 图片尺寸
|--background-repeat:no-repeat 删除默认平铺

/*样式 大小与背景*/

#beijingtupian{

　　margin-top:10px ;

　　width: 200px;

　　height: 200px;

　　border: 1px solid red;

　　background-image: url(../../xiaomi/disanhanggundong.png);

　　background-size: 150px,100px;/*背景尺寸*/

　　background-repeat:no-repeat ;/*背景平铺方式*/

}

<!--样式-->

<!--大小与背景-->

<div style="width: 200px; height: 200px; background-color: green;"></div>

<div id="beijingtupian"></div>

|-字体（font 文字）
|--字体的样式 font-family(微软雅黑、宋体、楷体等)
|--字体的大小 font-size
|--字体的格式 font-style
|--字体的粗细 font-weight
|--字体的颜色 color
|--给字体加线 text-decration：

/*字体样式*/

span{

　　font-family: "微软雅黑";

　　font-size:16px;

　　font-style: italic;/*字体倾斜*/

　　font-weight: bolder;/*字体加粗*/

　　text-decoration: line-through;/*删除线（through：穿过）*/

　　color: orange;

}

<!--字体的样式-->

<span>字体的样式</span>

0428css样式的更多相关文章

  1. 0428-css样式

    一.CSS样式表      引入的三种方式1.内联样式:标签内部     style2.内嵌样式:<head></head>标签内部(<style></sty ...

  2. 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧

    记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...

  3. BootStrap_02之全局样式及组件

    1.BootStrap指定的四种屏幕尺寸: ①超大PC屏幕--lg(large):w>=1200px: ②中等PC屏幕--md(medium):1200px>w>=992px: ③P ...

  4. CSS 选择器及各样式引用方式

    Css :层叠样式表 (Cascading Style Sheets),定义了如何显示HTML元素. 目录 1. 选择器的分类:介绍ID.class.元素名称.符合.层次.伪类.属性选择器. 2. 样 ...

  5. x:bind不支持样式文件 或 此Xaml文件必须又代码隐藏类才能使用{x:Bind} 解决办法

    这两天学习UWP开发,发现一个很有趣的问题,就是我题目中的描述的. 我习惯了在ResourceDictionary中写样式文件,但是发现用x:Bind时会有问题 如果是写在Style里,则提示 “x: ...

  6. input[tyle="file"]样式修改及上传文件名显示

    默认的上传样式我们总觉得不太好看,根据需求总想改成和上下结构统一的风格…… 实现方法和思路: 1.在input元素外加a超链接标签 2.给a标签设置按钮样式 3.设置input[type='file' ...

  7. WPF样式之画刷结合样式

    第一种画刷,渐变画刷GradientBrush (拿线性渐变画刷LinearGradientBrush(其实它涵盖在GradientBrush画刷内.现在拿他来说事.),还有一个圆心渐变画刷Radia ...

  8. JavaScript特性（attribute）、属性（property）和样式（style）

    最近在研读一本巨著<JavaScript忍者秘籍>,里面有一篇文章提到了这3个概念. 书中的源码可以在此下载.我将源码放到了线上,如果不想下载,可以直接访问在线网址,修改页面名就能访问到相 ...

  9. 邮件中嵌入html中要注意的样式

    工作中常会有需求向用户发送邮件,需要前端工程师来制作html格式的邮件,但是由于邮件客户端对样式的支持有限,要兼容很多种浏览器需要注意很多原则: 1.邮件使用table+css布局 2.邮件主要部分在 ...

随机推荐

  1. Vue项目结构说明

    简单介绍目录结构 http://blog.csdn.net/u013778905/article/details/53864289 (别人家的链接,留给我自己看的)

  2. Spring Cloud学习笔记-002

    搭建Spring Cloud注册中心:Eureka 服务注册:在服务治理框架中,通常都会构建一个注册中心,每个服务单元向注册中心登记自己提供的服务,将主机与端口号.版本号.通信协议等一些附加信息告诉注 ...

  3. delphi 10.1 Berlin 中使用自带的 Base64 编码

    delphi 10.1 berlin版本中,有好几个 base64 编码的单元可以使用,例如 Indy, MessageDigest_5,还有 CnBase64,我现在使用自带的 System.Net ...

  4. nodejs+express+mysql 增删改查(二)

    1.最早一篇关于express框架简单的增删改查文章,http://www.cnblogs.com/zhengyeye/p/nodejs.html#3947308:意外走红博客园,无奈自己之前一直没有 ...

  5. thinkjs升级到3.0后的图片上传

    似乎当thinkjs升级到3.0后,才接手了一个项目.只是在实际运用过程中,还是发现了与2.2的些许差别——今天先分享关于图片上传的一些问题. 1.上传文件,我们选择了jQuery的插件:http:/ ...

  6. Jenkins持续集成演示

    1.去我们的仓库修改一下代码 为了节约时间,我直接在网页上改了. 我们把布局页的footer信息改一下: 然后提交. 2.切换到Jenkins可以看到已经在构建了 等待构建完成. 3.访问我们部署的地 ...

  7. .NET Core2.0+MVC 用session，cookie实现的sso单点登录

    博主刚接触.NET Core2.0,想做一个单点登录的demo,所以参考了一些资料,这里给上链接: 1.http://www.cnblogs.com/baibaomen/p/sso-sequence- ...

  8. 一.Kylin的伪分布式安装

    一.伪分布式安装kylin 2018年4月15日 15:06 安装需要的环境 1. hadoop集群环境:由于安装的是CDH5.14.0的版本,所以相关组件都是跟5.14.0相关 2. spark采用 ...

  9. Git的安装和使用（托管至GitHub的方法）

    一.下载Git 1.下载 下载地址: https://git-scm.com/download/win 根据你的操作系统选择32位或者64位 2.安装过程一路next 3.检验安装是否成功 在桌面点击 ...

  10. [WC 2010]重建计划

    Description Input 第一行包含一个正整数N,表示X国的城市个数. 第二行包含两个正整数L和U,表示政策要求的第一期重建方案中修建道路数的上下限 接下来的N-1行描述重建小组的原有方案, ...