黄其威-20201028
知识总结:
表格:表格的行列合并
表单: action method
<Input type name value 数据回显
html5.0:h5->标签(
常见块级标签:textarea,input,img,button)
特点:可以和其他元素保持在在一行,还能能设置宽高)
(常见的行级标签:a,span,strong,u(下划线),em(强调),i(斜体),sub(下标),sup(上标
特点:可以和其他元素保持在同一行,不可以自动换行,但不能设置宽高)
Html中常见行级标签:span、a、em、strong、u ......
特点:在一行内显示(在一行中可以并列多个行级标签),不能设置宽高属性
Html中常见块级标签:div、p、ul、li、dl、td、dd、h1~h6 ......
特点:独占一行,能设置width,height属性
Html中常见行内块标签:img、input、textarea ......
特点:能和其它标签 同占一行(在一行中可以并列多个标签),能设置width,height属性
css.3.0 乘叠样式表 ->修饰网页
选择器(镜子):精准选择所要修饰的目标
常用的选择器:
margin 外边距
padding 内边距
border 边款
1、标签选择器:使用标签名称作为选择器选中标签设置样式。
特点: 可以选中多个标签,给一堆标签同时设置样式
2、类型选择器:在标签中利用class属性设置在样式表中 .类型名{设置样式}
特点:相当于给标签起了一个别名可以重名。也可以有多个名称
3、ID选择器:标签中利用ID属性进行设置,在样式表中, #ID{设置样式}
特点:一个标签有且只有一个ID,且不能重名,前端规范要求,不允许使用ID选择器来设置样式,原因:优先级太高, 不方便其他样式的叠加。
1、三大基本选择器优先级
id>class>标签
2、样式设置不生效的三大原因
a.设置的样式被其他样式叠加
设置的样式优先级没有其他样式优先级高
b.样式属性名写错
c.样式表中选择器标识符写错
样式表中选择器之间不能有其他字符,
如果有,该字符将向下与相邻的选择器构成新的选择器,导致选不中。
检查方法:在谷歌浏览器的控制台中,选中该标签,查看styles里面的
选择器,查看那个选择器不存在,那么是该选择器标识符 写法出错。
后代选择器:在后代选择器中,空格代表后代
格式:父标签 子标签{
属性:属性值;
属性:属性值;
选择器的优先级
相同属性下:后代选择器(子选择器)> id选择器 > class选择器 > 标签选择器
文本样式
color: red; /*修饰文字颜色*/
font-size: 30px; /*修饰文字大小*/
font-family: "宋体"; /*文字类型*/
font-style: italic; /*字体的样式*/
font-weight: bold; /*字体加粗*/
letter-spacing: 5px; /*字体间距*/
text-align: center; /* 对齐方式*/
line-height: 300px; /*行高*/
/*text-decoration: underline;*/ /*文本划线*/
text-shadow: 2px 2px 3px yellow ; /*字体阴影*/
text-indent: 2em; /*首行缩进*/
背景修饰样式
background-color: azure;/* 背景颜色*/
background-image: url(../img/pkq.jpg); /*背景图片*/
/*background-size:500px 300px ; /*图片背景的大小*/*/
background-size: cover; /* 覆盖 */
/*background-repeat: no-repeat ; /*背景图片平铺*/*/
/* background-repeat: repeat-x ; 沿着x轴平铺*/
background-attachment: fixed ; /*背景图片固定*/
/*background-position:-100px 0 ; /*背景图片平移*/*/
opacity: 0.5; /*透明度*/
心得体会:通过今天对HTML的学习,我学到很多东西,在这个过程中也遇到了很多意想不到的问题,不过每一个问题的解决都是我的一次小的进步,并且发现这此实践十分有意义。我本着积极肯干,虚心好学、工作认真负责的态度,让自己以最快的速度融入学习当中,发挥自己特长,学习知识
近期评论