CSS-笔记1-选择器与文本元素
2018-06-24 02:02:50来源：未知 阅读 ()
知识点一：
CSS概念：CSS 指层叠样式表 (Cascading Style Sheets)(级联样式表)
Css是用来美化html标签的，相当于页面化妆。
知识点二：
选择器格式与部分属性：
写法：
选择器{属性：值；属性：值}
选择器是一个选择（一/多个）标签的过程。
对应的属性与值表：
Width:20px; 宽
Height:20px; 高
背景颜色
font-size:24px; 文字大小
text-align:left | center| right 内容的水平对齐方式
text-indent:2em; 首行缩进
Color:red; 文字颜色
知识点三：
基础选择器：
一：标签选择器：
特点：标签选择器定义之后，会将页面所有的元素都执行这个标签样式。
标签{属性：值}
div{
font-size: 50px;
color:green;
background-color:yellow;
width:300px;
height:200px;
}
p{
color:pink;
font-size:60px;
}
颜色的显示方式：
- 直接写颜色名称。
- 十六进制显示颜色。
#000000;前2位代表红色，中间代表绿色，后两位代表蓝色。值越接近0颜色越深
- RGB
color：rgb(120,120,120);值在0-255之间。
- RGBA 最后一位值在0-1
color: rgba(102,217,239,0.5);
二：类选择器：
特点：谁调用，谁生效。一个标签可以调用多个类选择器，多个标签可以调用同一个类选择器。
在标签中使用class属性调用，不同的类之间用空格分开。
.自定义类名{属性：值；属性：值；}
.box{
font-size: 50px;
color:green;
background-color:yellow;
width:300px;
height:200px;
}
.miss{
color:pink;
font-size:60px;
}
类选择器命名规则：
不能用纯数字或数字开头来定义类名
不能使用特殊符号或者特殊符号开头（_）来定义类名。
不建议使用汉字来定义类名。
不推荐使用属性或者属性的值来定义类名。
常见的命名模板：
三：ID选择器：
特点：一个ID选择器在一个页面只能调用一次。如果使用两次或多次以上，是不符合w3c规范的，JS调用会出现问题。
一个标签只能调用一个ID选择器。
一个标签可以同时调用类选择器与ID选择器。
#自定义名称{属性：值；}
四：通配符选择器：
特点：给所有的标签都使用相同的样式。
不推荐使用。
*{属性：值；}
知识点四：
复合选择器： 概念：两个或两个以上的基础选择器通过不同的方式连接在一起。
一：交集选择器：
特点：既要满足使用的某个标签选择器，又要满足使用了类选择器。
标签+类（ID）选择器{属性：值；}
div.box{
color：red;
}
div#miss{
width:400px;
height:300px;
background-color:yellow;
}
二：后代选择器：
选择器特点：后代选择器首先要满足包含（嵌套关系）
父集元素在前，子集元素在后。
特点：无限制隔代。
只要能代表标签，标签、类选择器、ID选择器自由组合。
div #miss{
width:400px;
height:300px;
background-color:yellow;
}
<div>
<div id="miss"></div>
</div>
三：子代选择器：
选中直接下一代元素
选择器>选择器{属性：值；}
div>span{
width:300px;
height:200px;
}
p>span{
width:300px;
height:200px;
}
<div>
<p>
<span>赵灵儿</span>
</p>
<span>林月如</span>
</div>
四：并集选择器：
选择器+，+选择器+，选择器{属性：值；}
特点：某些元素或部分元素的属性完全相同，则他们可以写在一块。
.box,#miss,span,h1{
width:300px;
color:#000;
}
知识点五:
文本元素：
一：属性：
font-size:16px; 文字大小
font-weight：700； 值从100-900，文字粗细，不推荐使用font-weight：bold；
font-family：微软雅黑； 文字字体
font-style：normal|italic normal默认值，italic斜体。
line-heitht：10px； 行高。
文本属性连写：
font: font-style font-weight font-size/line-height font-family;
注意：font:后边写属性的值。一定按照书写顺序。
文本属性连写文字大小和字体为必写项。
例： Font:italic 700 16px/40px 微软雅黑;
文字的字体表达形式：
一：直接写中文名称：
div{
font-family：微软雅黑；
font-size：60px;
}
二：写字体的英文名称：
div{
font-family:microsoft yahei;
font-size:15px;
}
Unicode编码：
如何快速获得字体的Unicode编码：
在页面的console中
escape(“字体名”)
即可获取。
标签：
版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有
下一篇：HTML
- HTML骨架 2020-06-10
- css：选择器（标签、类、ID、通配符） 2020-05-29
- CSS基础选择器总结 2020-05-27
- 通配符选择器 2020-05-27
- CSS选择器的优先级 2020-05-18
IDC资讯： 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营： 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程： Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术： Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧： 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作： FrontPages Dreamweaver Javascript css photoshop fireworks Flash
