CSS样式学习-1
一、分类
①内联,写在标签中,写法是style="样式属性"。优先级最高。
优点:控制精确。缺点:代码重用性差,范围小。
例如:
<div style="font-size=12px;"></div>
②内嵌,在<head></head>中书写。
优点:代码重用性好,范围大。缺点:控制性差,不精确。优先级最差。
注释方法:/*注释内容*/
例如:
<style type="text/css" >
/*这是要被注释内容*/
</style>
③外部,在<head></head>中书写。
优点:代码重用性最好,范围最大。缺点:控制性差。优先级中。
使用<link />标签引用外部css。
例如:
<head>
<link src="Untitled.css" />
</head>
二、选择器
①元素命名,id、class
*号是指所有。
*{}对所有元素增加样式。
②获取id
#id{}选择id名称是“id”的元素,id具有唯一性。
③获取class
.class{}获取class名称是“class”的元素,class可以命名多个元素。
④标签选择器
格式为:标签名{}
,并列
空格后代
.点筛选
例如:
<head>
<style type="text/css">
div{}/*标签选择器*/
#a{}/*id选择器*/
.b{}/*类级选择器*/
div #a{}/*空格后代,div标签下的span标签*/
div, font{}/*逗号并列,div和font标签*/
</style>
</head> <body>
<div>
<span id="a">
</span>
</div>
<font class="b">
</font>
</body>
CSS样式学习-1的更多相关文章
- 11种常用css样式学习大结局滚动条与显示隐藏
滚动条展示 overflow-x: hidden;/*是否对内容的左/右边缘进行裁剪*/overflow-y: hidden;/*是否对内容的上/下边缘进行裁剪*/overflow:scroll;/* ...
- bootstrap全局CSS样式学习
参考http://v3.bootcss.com/css/,根据自己的记忆进行的复述,加深记忆. 首先介绍bootstrap全局CSS样式 只通过使用bootstrap.css,即可获得统一的样式设置. ...
- Boostrap入门级css样式学习
1. 自适应网页设计 首先,在网页代码的头部,加入一行 viewport元标签.viewport是网页默认的宽度和高度, <meta name="viewport" cont ...
- 2019-02-15 CSS样式学习——(内容来自mooc北京林业大学web前端开发授课ppt)
CSS样式的添加方法 行内样式 e.x. 内嵌样式 e.x. 注意内嵌样式写在head标签内: 单独文件(外部式样式表文件) 也是在head标签内插入超链接,sublime+emmet可以用link: ...
- css样式学习笔记
视频参见php中文网玉女心经视频教程 讲解的相当的清楚和明白 第1章 :css快速入门 1.1 什么是css 改变html框架的样式. 1.2 css的三种引入形式 第一种形式 ...
- html之CSS样式学习笔记
本文内容: 字体样式 文本样式 背景样式 尺寸样式 盒子模型 边框样式 边距样式 浮动布局 定位布局 [CSS3]伸缩布局 标签显示方式 列表样式 [CSS3]过渡样式 [CSS3]变换样式之2D变形 ...
- CSS样式学习-3、轮廓、伪类/元素、display-flex布局
一.轮廓 outline绘制于元素周围的一条线,位于边框边缘外围. 属性规定元素轮廓的样式.颜色.宽度. outline-width轮廓宽度,属性:thin细轮廓.medium中等(默认值).thic ...
- css样式学习小知识
1. 使用百分比设置宽高 自适用宽高的,有分割的区域,可以适用百分比:30% 70% 如果有一部分是固定的宽度或者高度,可以使用:height: calc( 100% - 36px ); 2. inp ...
- bootstrap 学习 ---css样式学习
bootstrap 适用于响应式布局,移动设备优先的web项目 1.学习bootstrap需要引入bootstrap的css,jquery,bootstrap的js,注意:jquery文件必须在boo ...
随机推荐
- C#、AE开发入门之打开shp文件并显示
首先要建立好对应的对话框程序,并拖入axMapControl控件和axLisence控件,并设置一个按钮打开该文件 当然在使用前一定要绑定对应的ArcGis产品 static void Main() ...
- 云中树莓派(5):利用 AWS IoT Greengrass 进行 IoT 边缘计算
云中树莓派(1):环境准备 云中树莓派(2):将传感器数据上传到AWS IoT 并利用Kibana进行展示 云中树莓派(3):通过 AWS IoT 控制树莓派上的Led 云中树莓派(4):利用声音传感 ...
- APP中https证书有效性验证引发安全问题(例Fiddler可抓https包)
原文: https://blog.csdn.net/woddle/article/details/71175140 在实际项目代码审计中发现,目前很多手机银行虽然使用了https通信方式,但是只是简单 ...
- Jmeter(八)HTTPCookie管理器
Cookie绝对是日常工作以及技术中一个绕不过去的‘角色’,正常各种各样的业务需要Cookie的存在.Jmeter中也有支持发送Cookie的组件,但是,仅是后话:在此还是有必要先记一记Cookie到 ...
- Jmeter(六)Jmeter脚本包含要素及书写习惯
Jmeter有丰富的组件,逻辑控制器.配置原件.Sampler.定时器.前置处理器.后置处理器.断言.监听器:而编写脚本一定要养成个人习惯,让人看到Jmeter的脚本目录结构树能够一目了然:因此,首先 ...
- 修改了jdk在环境变量中的路径怎么cmd中的jdk版本没有变
把path路径下的jdk配置放在前面%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;%SystemRoot%\system32;%SystemRoot%;%SystemRoot ...
- Android ImageView点击效果
ImageView设置点击效果需要注意两点,第一个设置android:clickable="true",第二个 <item android:drawable="@d ...
- IDEA配置打可运行jar包
IDEA打包可以运行的jar包大体有两种方式:一种是比较方便的配置maven:一种是直接配置IDEA采用Build Artifacts打包. 配置maven打包,在pom.xml里面配置build插件 ...
- c#语言集合分析
集合的赋值: double fenshu = 0; al.Add(fenshu=double.Parse (Console .ReadLine ())); //如果是存数字,将来要比较大小,需要再添加 ...
- Qt Opengl
目前在Qt5中做Opengl的学习时候,发现gluPerspective函数没有定义. 1: gluPerspective( 45.0, (GLfloat)width/(GLfloat)height, ...