css——day1

css——day1

1.css定义

        css定义：层叠样式表，一种样式表语言，用于美化html

        书写位置：title下方添加style（双标签），选择器+{}

        如p{color：red；}

 

2.css引入

        内部样式表：学习使用———写在style标签内

        外部样式表：开发使用———写在单独的css文件里（.css）。用link标签引入：<link rel="stylesheet" href="....css">

        行内样式表：配合JavaScript，写在style标签里，：<div style="color:red;">这是</div>

 

3.选择器

        作用：查找标签设置样式

        基础选择器：1.标签选择器 2.类选择器 3.id选择器 4.通配符选择器.......

        1.标签选择器

                使用标签名为选择器

                例如：p、h1、div、a、......

 

        2.类选择器

                作用：查找标签，差异化设置标签，显示效果

                步骤：1.定义类名-.类名  2.标签加class="类名"

                提示：一个class可以使用多个类名，类名之间用空格隔开

 

        3.id选择器

                作用：找标签，设置标签显示效果

                步骤：1.定义id选择器-#id名，2.使用，标签加上id="id名"

 

        4.通配符选择器

                作用：查找页面所有的标签，设置相同样式

                通配符选择符：*，不可调用，自动应用，如：*{color：red；}

 

        画盒子

                目标：使用合适的选择器画盒子

                标签：宽：width；高：height；背景色：background-color；

 

4.文字控制属性

        属性：对齐：text-align；修饰线：text-dcoration；颜色：color；字体大小：font-size；粗细：font-weight；倾斜：font-style；行高：line-height；字体族：font-family；复合属性：font；缩进：text-indent；

1.字体大小：font-size（单位一般是px） 

2.字体粗细：font-weight（属性名为数字）

        关键词：正常：normal；加粗：bold

 3.倾斜：font-style；

 4.行高：line-height；

5. 字体族：font-family；

6.font复合属性

        用空格隔开；

 

 7.缩进：text-indent；

8.文本对齐：text-align（图片也可对齐父标签）

 

 9.文本修饰线：text-decoration

10.文字颜色：color