0428css样式
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样式的更多相关文章
- 0428-css样式
一.CSS样式表 引入的三种方式1.内联样式:标签内部 style2.内嵌样式:<head></head>标签内部(<style></sty ...
- 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧
记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...
- BootStrap_02之全局样式及组件
1.BootStrap指定的四种屏幕尺寸: ①超大PC屏幕--lg(large):w>=1200px: ②中等PC屏幕--md(medium):1200px>w>=992px: ③P ...
- CSS 选择器及各样式引用方式
Css :层叠样式表 (Cascading Style Sheets),定义了如何显示HTML元素. 目录 1. 选择器的分类:介绍ID.class.元素名称.符合.层次.伪类.属性选择器. 2. 样 ...
- x:bind不支持样式文件 或 此Xaml文件必须又代码隐藏类才能使用{x:Bind} 解决办法
这两天学习UWP开发,发现一个很有趣的问题,就是我题目中的描述的. 我习惯了在ResourceDictionary中写样式文件,但是发现用x:Bind时会有问题 如果是写在Style里,则提示 “x: ...
- input[tyle="file"]样式修改及上传文件名显示
默认的上传样式我们总觉得不太好看,根据需求总想改成和上下结构统一的风格…… 实现方法和思路: 1.在input元素外加a超链接标签 2.给a标签设置按钮样式 3.设置input[type='file' ...
- WPF样式之画刷结合样式
第一种画刷,渐变画刷GradientBrush (拿线性渐变画刷LinearGradientBrush(其实它涵盖在GradientBrush画刷内.现在拿他来说事.),还有一个圆心渐变画刷Radia ...
- JavaScript特性(attribute)、属性(property)和样式(style)
最近在研读一本巨著<JavaScript忍者秘籍>,里面有一篇文章提到了这3个概念. 书中的源码可以在此下载.我将源码放到了线上,如果不想下载,可以直接访问在线网址,修改页面名就能访问到相 ...
- 邮件中嵌入html中要注意的样式
工作中常会有需求向用户发送邮件,需要前端工程师来制作html格式的邮件,但是由于邮件客户端对样式的支持有限,要兼容很多种浏览器需要注意很多原则: 1.邮件使用table+css布局 2.邮件主要部分在 ...
随机推荐
- JavaScript的sleep实现--Javascript异步编程学习
一.原始需求 最近在做百度前端技术学院的练习题,有一个练习是要求遍历一个二叉树,并且做遍历可视化即正在遍历的节点最好颜色不同 二叉树大概长这个样子: 以前序遍历为例啊, 每次访问二叉树的节点加个sle ...
- Python系列之 - 反射
一.静态方法(staticmethod)和类方法(classmethod) 类方法:有个默认参数cls,并且可以直接用类名去调用,可以与类属性交互(也就是可以使用类属性) 静态方法:让类里的方法直接被 ...
- 闭包(closure)
大牛的讲解,点击 我们首先需要有作用域的概念,点击 那么什么是闭包? 官方的解释是:闭包是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分. 广义上的 ...
- 搭建自己的maven私服 必过
教你一步一步搭建自己的maven私服 一. 应用场景 有些公司都不提供外网给项目组人员,因此就不能使用maven访问远程的仓库地址,所以很有必要在局域网里找一台有外网权限的机器,搭建nexus私 ...
- Canvas - 时钟绘制
导语:距离上一次写canvas,已经过去两年半,如今业务需要,再次拾起,随手记录. [思考] 时钟的绘制主要在于圆的绘制:1. 使用context.arc()方法直接绘制圆或圆弧: 2. 使用圆的方程 ...
- shell实现脚本监控服务器及web应用
实际工作中我们需要知道部署在服务器上的应用有没有问题,但是人为的操作太麻烦有咩有简单的方式呢shell来监控我们服务器运行状态以及服务器上部署的应用,如果出现异常就会自动发送一个邮件给我们,开始搞起. ...
- sdut 2878 圆圈
[ 题目描述]现在有一个圆圈, 顺时针标号分别从 0 到 n-1, 每次等概率顺时针走一步或者逆时针走一步,即如果你在 i 号点,你有 1/2 概率走到((i-1)mod n)号点,1/2 概率走到( ...
- NOIP 2009 最优贸易
题目描述 C 国有 n 个大城市和 m 条道路,每条道路连接这 n 个城市中的某两个城市.任意两个 城市之间最多只有一条道路直接相连.这 m 条道路中有一部分为单向通行的道路,一部分 为双向通行的道路 ...
- Codeforces Round #407 (Div. 1)
人傻不会B 写了C正解结果因为数组开小最后RE了 疯狂掉分 AC:A Rank:392 Rating: 2191-92->2099 A. Functions again 题目大意:给定一个长度为 ...
- hdu 5113(2014北京—搜索+剪枝)
题意:有N*M的棋盘,用K种颜色去染,要求相邻块不能同色.已知每种颜色要染的块数,问能不能染,如果能,输出任一种染法. 最开始dfs失败了- -,优先搜索一行,搜完后进入下一列,超时.本来以为搜索不行 ...