本帖最后由 chevili 于 2019-10-18 22:16 编辑
1.了解CSS
CSS是一种定义样式结构如字体、颜色、位置等的语言,被用于描述网页上的信息格式化和现实的方式。CSS样式可以直接存储于HTML网页或者单独的样式单文件。无论哪一种方式,样式单包含将样式应用到指定类型的元素的规则。外部使用时,样式单规则被放置在一个带有文件扩展名_css的外部样式单文档中
2.行内式
<标签 style="color:颜色;" > 更改文本颜色
标签+属性+属性值color:"颜色;"
font-size:18px; 更改字体大小
color: 颜色;
语法:<标签 style="属性1:属性值; 属性2:属性值; 属性3:属性值;"></标签>
样式分离不建议使用,文件可读性差
3.内部样式
<style> </style> 双标签内部样式
<head>
<style>
选择器{
属性:属性值;
}
</style>
</head>
4.外部样式表(外部链接样式结构完全分离)
创建style.css 格式文件 放在项目下面文件夹里
外部样式表能结构样式相分离
<link> 单标签配合属性
<link rel="stylesheet" type="text/css" href=css文件路径>编辑到html.head里
srl="stylesheet" 样式表
type 类型 引入css文件
href 引入路径
color 颜色
font-size 字体大小
好处:外部链接能更好的共享管理页面样式
css注释内容:/*注释内容*/
html注释:<!-- 注释内容 --> 注释提高代码可读性,写给我们自己看的
css样式规则(键值对规则)
1,确定加样式---选择器
2,书写{}
3,第三步 添加属性
5.类选择器
标签选择器会使全部标签内容同时改变样式,不建议使用
<style>里面输入·lv{} 类选择器可单独选择一个改变样式
使用方法:head里添加(.选择器),然后去标签输入类名
标签里添加类名: <h3 class="lv"> 类名自定义起名和style要一样
如果样式格式颜色一样就不需要重新创建 可一起使用
一个标签内部只能有一个class属性,一个class能输入多个类名属性值
<span class="red空格 类名></span>
6.类和id选择器区别
id选择器#号开头调用, 类选择器是.号开头调用
类选择器是可多次使用的,ID选择器只能一个页面使用一次独一无二的.
标注:做页面尽量用类
通配符选择器
*符号表示选中了的所有标签 ,包括学过w3c规定标签
margin"0"
padding"0"
7.font字体 font-size:20px; 尺寸大小
不同浏览器显示字体可能不一致,
通过font-size 一开始将body标签里整体尺寸调用一致16px
文字大小基本推荐用px格式
取值单位px常用推荐,em表示一个字大小
7.1.font-family 字体
按顺序自动查找字体,前者优先显示
类名{
font-family: Arial, Microsoft Yahei","微软雅黑";"黑体";
}
7.2.font-weight 字体加粗
bold 加粗
font-weight:700; 不需要添加单位 等于bold
normal 让粗体不加粗
400等价normal不加粗 700等同于bold加粗
7.3.font-style: 字体倾斜
font-style: normal; 使倾斜字体不倾斜
font-style: italic; 字体倾斜
8.text-align: 文本水平对齐方式
搭配:left左 right右 center居中
9.line-height:行间距
搭配:像素
设置两行之间的距离
|
|