论CSS样式的使用以及常用属性
css的使用方式()
1.行内样式(内联样式)
<标签 ></标签>
2.页面嵌入(内部样式表)
在head标签里面增加一个子标签
<style>
选择器{
属性名1:属性值1;
属性名2:属性值2;
......
}
</style>
3.外部文件(外部样式表)
在head标签里面增加一个子标签
<link rel="stylesheet" href="css文件的路径" />
4.外部导入样式
主要用在样式初始化。因为有一些标签有自己的样式,我们需要清空,方便自己计算
*{
margin: 0;
padding: 0;
}
css------选择器
ID选择器
使用id选择器:在元素上面增加一个id属性,id属性的属性值不用用数字开头
一个页面中只能有一个id属性值
css中id选择的表示方法用 # 表示
class选择器
使用class选择器:在元素上增加一个class属性,class属性的属性值不能用数字开头
一个页面中可以有多个class属性值
css中class选择器的表示方法用 . 表示
标签选择器
直接写标签名
组合选择器
选择器直接用,分隔开即可
子代选择器
> 只针对子代
后代选择器
用空格表示,包含着子代选择器
通用选择器
* 针对于所有的标签
选择器是有权重的
内联样式 1000
id 100
class 10
元素 1
通用 0
boss !important 只要出现,就以这个为主
text-align: right; /*文本对齐方式*/
text-decoration: underline; /*文本下划线*/
line-height: 166.67px; /*文本的行高*//*一行文字所占的高度,让他上下居中*/
font-family: "字体";设置字体的样式
font-style: ; /*规定字体是否倾斜*/
font-weight: bold;加粗
font-size: 16px ; /*设置字体的大小*/
在浏览器中,默认的字体大小16px
谷歌浏览器中,字体大小最小可以为12px
火狐没有限制
:hover 叫伪类选择器
当你的鼠标放上去的时候,会变化成的样子权值 10
无序列表:
<ul type="">
<li>英语</li>
<li>语文</li>
<li>数学</li>
<li>政治</li>
<li>地理</li>
</ul>
background-color: rgba(255,0,0,0.1); /*最后一个参数a表示透明度,取值的范围是0-1之间,可以为0和1*/
/*只表示背景颜色*/
background-color: #f00;
opacity: 0.1; /*取值的范围是0-1之间,可以为0和1*/
/*表示整个元素*/
转载于:https://www.cnblogs.com/awei313558147/p/10946530.html
论CSS样式的使用以及常用属性相关推荐
- CSS中设置字体样式的5种常用属性—让字体设置再无难点
设置字体样式的5中常用属性如下 1:color 设置字体颜色,也可以设置其他颜色 2:font-size 设置字体大小 (1).设置的并不是文字本身的大小,在页面中,每个文字都是处在一个看不见的框中的 ...
- 清零 css,css样式清零及常用类
/*css样式清零及常用类*/@charset "utf-8";/*CSS Reset*/ /*"微软雅黑","5FAE8F6F96C59ED1&qu ...
- CSS浏览器兼容性的4个解决方案:浏览器CSS样式初始化、浏览器私有属性,CSS hack语法和自动化插件...
前端是一个苦逼的职业,不仅因为技术更新快,而且要会的东西实在太多了(如果全写出来,那真是一箩筐),更让人头疼的是,还要面临各种适配.兼容性问题. 一直以来都是头痛医头脚痛医脚,没有进行系统的梳理,整个 ...
- [css] 说下你对css样式的这几个属性值initial、inherit、unset、revert的理解
[css] 说下你对css样式的这几个属性值initial.inherit.unset.revert的理解 initial(初始).inherit(继承).unset(未设置).revert(还原) ...
- CSS样式字体与文本相关属性
CSS样式字体与文本相关属性 字体相关属性 基本属性 添加阴影 添加多阴影 微调字体大小 颜色表示 文本相关属性 文本基本属性 文本自动换行 长单词和URL地址换行 CSS3新增服务器字体 字体相关属 ...
- jquery拼接后css样式不生效_JQuery常用选择器以及操作属性和样式的方法介绍
JQuery日常操作有选择器,获取和操作属性,css样式,文本等等,下面是一些常用的操作,代码以图片形式(哈哈,其实还是我懒,大神别喷我,我还是渣渣),就是一些日常的学习笔记 JQuery中的属性选择 ...
- html表格线条粗细,css 细线表格 css制作table细线表格常用属性
Css制作table细线表格 1.介绍了一个不常用属性:border-collapse:collapse; 2.使用了一个属性缩写技巧:border:style color;border-width: ...
- 图文样式css样式,初学解惑:常用CSS样式图文设置教程
注:在论坛中记得有人问过,做了网页之后字体特别大?如何控制网页中的字体呢?答案是用CSS来控制,今天给大家编写这个教程主要是面对初学者的! 一个有链接的文本,鼠标ON.OVER不同状态下的响应是不同的 ...
- html页面的css样式、meta最常用的最基本最常规的配置参数
图片 img{width:100%;vertical-align: middle;} 表格 table {border-collapse: collapse;border-spacing: 0;}ta ...
最新文章
- 比特币 交易程序 php,比特币PHP离线交易开发包
- hive执行drop卡死一例:java.lang.NoSuchMethodError: org.apache.commons.lang3.StringUtils.isAnyBlank
- 经典:区间dp-合并石子
- 翻译:Asp.net中多彩下拉框的实现
- 前端学习(2974):组件重定向
- __name__ == ‘__main__‘的原理
- 郭明錤爆料:苹果造车团队已解散
- python集合运算_从零开始学Python - 第014课:常用数据结构之集合
- Scala-trait
- 三角形面积 java_java编程中求三角形面积肿么写?
- ubuntu 安装nvm
- setting-mirrorO以及下载jar包流程简介
- [论文写作笔记] C2论文写作结构与思路 C6 让研究方法称为加分项
- 数据结构例程——串的模式匹配(Brute-Force算法)
- 电脑更换硬盘 | 怎么迁移数据到新硬盘?
- 自我提升的10个好习惯
- 3款大数据bi工具,让企业数据分析更简单
- 中国石油大学(北京)本科毕业论文答辩和论文选题PPT模板
- Rosalind第68题:Counting Optimal Alignments
- Vue中使用Tinymce-edtio
热门文章
- 2013ACM多校联合(2)
- 谷歌x实验室汇聚顶尖人才,研发出了一种超前设备,直接打脸专家
- 还纠结选机器学习还是深度学习?看完你就有数了
- 如何用WORD制作三线表
- excel字符串和单元格拼接_Excel实例分享-学会输入数据小技巧,让你的工作效率远超同事...
- java继承关键字super_java学习笔记-继承中super关键字
- 005_JSONArray对象静态方法
- 030_jQuery Ajax的get方法
- 注册不上zookeeper无报错_Zookeeper 跨区高可用方案
- log4j 打印线程号配置_log4j配置参数