sumbit reset button是通过修改value修改框里面的文字
<textarea>文本内容</textarea> 文本内容是什么就会在大文本框里面出现
<input type="text" value="文本内容"> 文本内容默认也会显示在框框里面
CSS
css简介
css基础选择器
css字体属性
css文本属性
综合案例
chrome调试工具
CSS选择器：选择标签
选对人 ：找对应标签
做对事：设置标签样式
选择器：
1.基础选择器 -->标签选择器 类选择器 id选择器 通配符选择器。
2.复合选择器
标签选择器：
标签名 {
属性1: 属性值1；
属性2：属性2；
属性3：属性值3；
}
标签选择器：是用html标签名作为选择器，把某一类标签全部设置同一样式。缺点：造成不能差异化设置相同标签，所有一类标签只能一样的样式。
类选择器：----》
口诀：样式点定义 结构类(class)调用 一个或多个 开发最常用
类选择器之--->多类名
<div class="red front20">亚瑟</div>
在标签class属性中写多个类名
多个类名中间用空格分开
这个标签可以分别用于这些类名的样式
多类名的使用场景：把标签元素相同的样式放在一个类里面 ；这些标签都可以调用这个公共的类，然后再调用自己独有的类。
- 类选择器可以被多个元素调用。
- id 选择器只能允许一个标签调用。
- 类选择器使用的较多。id 选择器用于唯一特性的标签，经常呵javaScript搭配使用
通配符选择器：不需要调用，自动就给所有的元素使用样式
* {
属性1: 属性值1;
...
}
CSS字体属性
3.1字体系列
- css使用font-family属性定义文本的字体系列
注意：
- 各种字体之间必须使用英文的逗号隔开；
- 有空格隔开的字体系列用引号引起来 比如
- "Microsoft Yahei"有引号 -----Arial没有引号；
当字体的名称超过两个单词就要加引号 中文字体名称都要加引号（因为中文字体一般都超过2个字 ）
- 可以给body标签指定字体系列
- 多个字体样式 按序查找 有哪个就算哪个字体样式
3.2字体大小 font-size定义字体大小
p{
font-size:20px;
}
- px(像素)大小是我们网页的最常用单位
- 谷歌浏览器的文字大小为16px
- 可以给body指定文字大小
- <h></h>标题标签比较特殊 指定body标签里面的字体大小时 标题标签不会变化 需要单独指定标题标签的文字大小
3.3字体粗细 font-weight：100~900
正常normal==400
加粗bold==700 数字后面不带单位
实际开发中更喜欢用数字表示粗细
一般给自带粗体的标题 转换成正常粗细的字体
- 学会让加粗标签不加粗（比如和和strong标签）
，或者其他标签加粗
3.4字体样式：正常normal，斜体italic
平时我们很少给文字加斜体，反而要给斜体标签em和i改称不倾斜的字体
css字体复合属性
font：font-style font-weight font-size/line-height font-family;
- 样式粗细大小系列顺序不能颠倒 各个属性之间要空格隔开
- 不需要设置的属性可以省略（取默认值），但必须保留font-size和font-family属性，否则font属性将不起作用
4.CSS文本属性：文本颜色，对齐文本，装饰文本，文本缩进，行间距
4.1文本颜色color
4.2对齐文本：text-align
设置元素内文本内容的水平对齐方式
left（默认） right center
4.3装饰文本text-decoration：
- none 默认 没有装饰线(最常用 ) 删除下划线
- 下划线 underline（常用）添加下划线
- 删除线 line-through
- 上划线overline
4.4文本缩进text-indent: 2em 首行缩进2个文字大小
4.5行高line-height：控制行与行之间距离
5.CSS引入方式
5.1三种样式表：
- 行内样式表（行内式）
- 内部样式表（嵌入式）
- 外部样式表（链接式）
5.2内部样式表：
将 CSS 代码写在 HTML 页面内部，单独放在一个 <style> 标签中。
<style>理论上可以放在 HTML 文档中任何一个地方，一般放在<head>标签中。- 方便控制整个页面中的元素样式。
练习时使用，实际开发不用。
5.3行内样式表 在标签里面写样式就可以
<div style="color: pink font-size: 20px">阮小可要瘦到104斤</div>
5.4外部样式表(开发最常用)
- 新建一个.css文件 里面写上样式 不用带style标签
- 在要修改的结构的html的head标签里面写上
<link rel="stylesheet" href=".css的文件名路径">
href有同级路径 上级路径 下级路径
div是块级元素,是独占一行的一般情况下,两个相邻的div是不会处于同一行的
扫一扫
804
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
