博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
html基础
阅读量:4979 次
发布时间:2019-06-12

本文共 3590 字,大约阅读时间需要 11 分钟。

1、html:

   hypertext    markup   language

超文本 标记 语言

2、1)font-size   设置字体尺寸

2)font-weight 设置字体粗细

3、Target 目标 :

_self   原窗口(默认)

_blank   新窗口

_top 顶层框架

_parent  父框架

4、tablet特有属性

Cellspacing 单元格间距(单元格之间的间距)

Cellpadding 单元格边距(单元格内文字与边框之间的距离)

5、对齐

 Align(水平):left center right

左 中 右

Valign(垂直):top middle bottom

上 中 下

6、td合并

水平  colspan  跨列(合并列)

垂直 rowspan 跨行(合并行)

7、表单

1)input 输入  2)select 选择  3)textarea 多行文本输入框

4)File  文件域

8、四种按钮:

1)Submit 提交 2)Reset 重置 3)button 普通按钮 4)image 图像按钮

9、 1)multiple 多选   2)placeholder   占位符

10、CSS

Cascading style sheets

层叠 样式 表

11、

1):link 点击前

2):visited 点击前

3):hover 放上去(鼠标滑过)

4):active 按下去(点击瞬间)

12、  text-decoration:(文本装饰)

a) Overling 上划线

b) underline 下划线

c) line-through 删除线

d) none 去掉超链接下划线

13、text-indent 文本缩进 (像素、百分比、em、负值)

14、

1)background-color 背景颜色

2)Background-image 背景图片

3)Background-repeat 背景是否重复

A)Repeat 重复(默认)

B)No-repeat 不重复

C)Repeat-x 水平方向重复

D)Repeadt-y 垂直方向重复

4)background-position :背景图片位置

A)right top 水平  垂直

5)background-attachment: 背景滚动模式

15、 1)list-style-type: disc circle square decimal

               实心圆 空心圆 方块 数字

2)list-style-image:

3)List-style-position

16、盒模型:

Content(width/height)+padding+border+margin  盒子实际大小

内容 内边距 边框   外边距

17、border-style:solid dashed dotted none

实线 虚线 点线 无

18、display(显示):

a)block (行内转块)

b)Inline-block (行内块) 兼容到IE8

c)Inline (块转行内)

d)None (不占位隐藏)

Visibility(可见性):hidden (占位隐藏)

19、position(方位、状态):

1)static 静态

2)Relative 相对定位(相对自己原来位置定位)

3)Absolute 绝对定位

4)Fixed 固定定位 不兼容IE6(相对于浏览器窗口)

Z-index(遮罩层):值越大越靠前,可使用负值

20、h5新增主体结构元素:

A)article 文章

B)Section 区块(通常由内容及标题)

C)Nav 导航

D)Aside 侧栏

E)Time 时间(行内元素)

21、新增的非主体结构元素

A)header 头部

B)Main 主体(唯一)

C)Footer 页脚

D)Address 文档或文章的作者信息(默认倾斜、块元素)

 

22、audio音频:

A)autoplay 自动播放

B)Controls 控件

C)Loop 循环

D)Preload 预载(是否在页面加载后载入)

23、video 视频:

A) autoplay 自动播放

B)Controls 控件

C) Loop 循环

D)Preload 预载(是否在页面加载后载入)

E)width /height 宽/高

24、embed 多媒体

25、智能表单

A)email 邮箱

B)URL 路径

C)Date 日期

D)Time 时间

E)Month 月

F)Week 周

G)Number 数字(手机调出)

H)Range   滑动条表单

I)Search 搜索

J)Color 颜色

26、新增表单属性

a) Required 内容不能为空,必填

b) Placeholder 提示信息,存在默认值

c) Autofocus 自动聚焦(默认为on,)

d) Pattern 正则 (不做表单验证设置novalidate=“true”)

27、css新增属性

A) 盒子阴影:box-shadow  

blur 模糊值  inset内阴影

B) 文字阴影:text-shadow

C) 文字溢出:text-overflow

Clip: 裁剪(默认值)

Ellipsis: 省略号

          White-space(空格):nowrap(强制不换行)

     Overflow(溢出):  hidden(溢出隐藏)

     Text-overflow(文字溢出):ellipsis

28、边框圆角:border-radius

单独一个角(左上):Border-top-left-radius

29、盒模型模式:box-sizing

Content-box 内容框 宽高是内容大小

Border-box 边界框 宽高是实际大小

30、背景渐变:

A)linear-gradient: 线性渐变

线性  变化率

B)Radial-gradient:放射性渐变

放射

C)Repeating-linear-gradient:重复渐变

重复

 

31、background-size:

a) Auto 背景图像真实大小

b) Cover 遮盖(等比缩放到完全覆盖容器)

c) Contain 包含

32、Opacity 透明(取值在0到1之间)

32、伪类选择器:

a) First-child  第一个选择器

b) Last-child  最后一个子元素

c) Nth-child(n) 指定序号的子元素

d) Nth-child(even) 索引是偶数的元素

e) Nth-chold(odd) 奇数

f) :checked 选中状态

g) ::selection 被选中是的状态

h) :disabled 不可用状态

i) :enabled  可用

33弹性盒

A)viewport 视口(设置网页代码适应设备宽度)

B)Diaplay(显示): box盒

Flex弯曲(新版本弹性盒)

C)box-orient(方向):horizontal 水平(默)

 Vertical  纵向

D)box-ordinal(依次)-group(组)

E)box-pack(包):start(开始) center(居中) end(结束)

 

34、C3动画

a) Transform 变形

1)Transform:  rotxate|scale|skew|translate

旋转  缩放 扭曲 位移

2)translate(x,y)         2D 转换。

translate3d(x,y,z)     3D 转换。

translateX(x)         X 轴的值。

translateY(y)        Y 轴的值。

translateZ(z)        Z 轴的值。

  transform-origin: left  top

              起源

b)transition 过渡   

transition: width   2s      linear    0.5s;

           属性   时间    速度      延迟  

1)transition-property           需过渡 CSS 属性,默认all

2)transition-duration           需要多少秒或毫秒。

3)transition-timing-function 速度曲线。

4)transition-delay            过渡何时开始。

c)transition-timing-function 速度曲线

1)linear     匀速

2)ease     慢--快--慢

3)ease-in    以慢速开始

4)ease-out  以慢速结束

5)ease-in-out 慢速开始和结束

6)cubic-bezier(n,n,n,n) 函数中定义值n为0-1

转载于:https://www.cnblogs.com/lixiangzheng/p/9007500.html

你可能感兴趣的文章
vue中提示$index is not defined
查看>>
css选择器
查看>>
ASP.NET上传下载文件
查看>>
Galaxy Nexus 全屏显示-隐藏Navigation Bar
查看>>
Spring中使用Velocity模板
查看>>
上周热点回顾(8.18-8.24)
查看>>
Feature toggle
查看>>
day02
查看>>
gvim 配置Pydiction
查看>>
Linux安装指定mysql版本
查看>>
分布式锁的三种实现方式
查看>>
poj 2109 pow函数也能这么用?p的开n次方
查看>>
Oracle database link
查看>>
python调用shell小技巧
查看>>
TL431的几种常用用法
查看>>
js 经典闭包题目详解
查看>>
在项目中移除CocoaPods
查看>>
【洛谷】CYJian的水题大赛【第二弹】解题报告
查看>>
POJ 1703 Find them, Catch them【种类/带权并查集+判断两元素是否在同一集合/不同集合/无法确定+类似食物链】...
查看>>
L1-5. A除以B【一种输出格式错了,务必看清楚输入输出】
查看>>