CSS 的出现， 实现了网页的结构和样式分离。美容师！
CSS 规则由两个主要的部分构成： 选择器， 以及一条或多条声明
CSS 规则由两个主要的部分构成： 选择器， 以及一条或多条声明
以内嵌式样式表为例
vs code快捷键： ctrl+/
CSS的英文可以大写，也可以小写
建议全部小写！
颜色名就是使用颜色的英文单词进行表示
更多的颜色名可以通过查询手册得到
颜色值指使用具体颜色的数值表示。 包括： rgb 模式和十六进制模式写法
常用颜色的 rgb 色值：
常用颜色的十六进制色值：
注： 十六进制颜色值简写模式： 如果红、 绿、 蓝三个原色的色值每一个都是由重叠的数字组成， 可以将重叠的数字简化成一个进行书写。 如： 红色 #f00
如果不设置字体属性， 不同的浏览器有自己的默认字体
首选字体需要根据设计图确定， 最后需要设置备用字体
缺点： id 选择器只能实现单选， 不能帮我们完成多选的功能
原子类： 在css中提前设置一些类名， 每个类选择器后面只添加一条css样式属性， 这些属性会在页面中常被使用， 后期可以不需要多次书写属性， 只要将对应的类名添加给需要的标签即可
实际工作中， 通常我们有一个使用规律： 类上样式(CSS)， id 上行为(JavaScript)
优点： 减少 class 属性的使用， 选择效率更高
继承性是一个很好的性质， 可以将页面中出现最多的文字样式设置给一个较大的祖先级标签比如 <body>， 后期所有的后代标签都可以从 <body>进行继承
方法有以下几种1.你说的没有变化,可能是因为样式是应用表格上的缘故,如果是应用在<td class=title_main>最新文章</td>应该即可
2.单独给标题设置样式, 采用<span calss="title_1">标题</span>
CSS的样式代码如:
.title_main{font-size:12pxcolor:#f00line-height:20px}
样式解释:
font-size 表示字体大小, color 颜色, line-height表示行高,我这里设了20px, 这样就显得比较开阔,容易阅读,就和WORD 里面1.5倍行距比1倍行距容易阅读的道理一样. 因为浏览器默认字体是 宋体, 所以font-family:宋体 可以省略,如果是其他字体则需要这条.
如果是比较大的标题: 可以采用以下样式:
.title_main{font-size:20pxcolor:#f00line-height:30pxfont-weight:bold}
和上面的样式相比,这个字体扩大,行距加大,字体加粗.
3.给标题设置样式,其实还可以用<h1>标签
<h1>文章标题</h1>
说明:
<h1>(除了<h1>,还有<h2><h3><h4><h5><h6>) 这些是专门用于设置不同大小的代码, 其中这些代码默认值都是有加粗的,字体大小由<h1>到<h6>逐渐变小,字体颜色默认为黑色,当然,大小/粗细/颜色都能修改的.
比如设置<h1>样式,css样式代码如:
h1{font-size:12pxcolor:#f00line-height:20px}
注意,h1前面没有任何标点,这样的话,整张网页里面所有用过<h1>标签的都会应用这个样式. 和 .title_main 只有加了class="title_main" 才应用样式不同.
而且和 CLASS 类相比, <h1>更加简洁,如果样式设置一样
<span calss="title_1">标题</span> 和<h1>文章标题</h1> 效果是一样的.
CSS 还有其他许多功能, 你可以在DreamWeaver里一个个添加 尝试 /对比 ,很快就能基本掌握CSS 基础的设置了,当然,有些设置还是需要经验和实践才能运用的比较娴熟和简练的.
一、简单的选择器
1）标签选择器
与网页元素同名，用的最多，也简单，即直接作用于与该选择器名字相同的标签
2） 类选择器
能够为网页对象定义不同的样式类，实现不同元素拥有相同的样式，相同元素的不同对象拥有不同样式
3）类选择器和标签结合在一起==>指定类选择器
指定该类用于特定的标签范围内
4）ID选择器（ID唯一）
这个就不举例讲解了，类比类选择器，把"."换成"# "即可
5）通配选择器
如果所有元素都需要定义相同的样式，推荐使用通配选择器
二、复合选择器
1）子选择器
2）相邻选择器（二者有相同父元素）
**利用相邻的兄弟元素来控制，即相邻选择器就是指定一个元素相邻的下一个元素的样式。相邻的选择器使用+表示
3）包含选择器（后代选择器）
第一对象一定要内包含第二对象
4）选择器嵌套
5）属性选择器
属性选择器就是利用网页标签包含的属性及其属性值来定义特定对象或一定范围元素的样式。
1.匹配属性名选择器
2.扩展
3.匹配属性值选择器
4.模糊匹配属性值选择器
类似正则表达式
6）伪选择器和伪元素选择器
标签之间可以通过逗号隔开来设定多个标签的CSS样式
