网创优客建站品牌官网
为成都网站建设公司企业提供高品质网站建设
热线:028-86922220
成都专业网站建设公司

定制建站费用3500元

符合中小企业对网站设计、功能常规化式的企业展示型网站建设

成都品牌网站建设

品牌网站建设费用6000元

本套餐主要针对企业品牌型网站、中高端设计、前端互动体验...

成都商城网站建设

商城网站建设费用8000元

商城网站建设因基本功能的需求不同费用上面也有很大的差别...

成都微信网站建设

手机微信网站建站3000元

手机微信网站开发、微信官网、微信商城网站...

建站知识

当前位置:首页 > 建站知识

web前端开发H5知识点-创新互联

首先h6里面有几个通用的格式,不再像之前每次用div定义。
header
nav
section
aritcle
aside
footer
视频和音频的格式
video:ogg webm mp4
audio:mp3 ogg wav
属性:
width height src controls autoplay loop poster
src 文件源 controls插件,也就是下面的进度条一栏 loop循环播放 poster暂停
表单
text password textarea checkbox radio file select button submit reset
H5 表单:
email,url,date,week,month,time,number,color,range,search
H5表单属性
required 必填项
autocomplete 自动记忆
plactholder 提示信息
pattern 正则表达式pattern=[a-z]{3} 意思就是输入三个字母 了解一下
autofocus 自动聚焦
去边距间距:
html, body, ul, li, ol, dl, dd, dt, p, h2, h3, h4, h5, h6, h7, form, fieldset, legend, img
*{}

创新互联从2013年成立,先为衢州等服务建站,衢州等地企业,进行企业商务咨询服务。为衢州企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。

选择器
元素选择器

  • 通配符
    e 标签选择器
    #id id选择器
    .class 类选择器
    关系选择器
    e f 包含选择器
    e>f父子选择器
    e+f 相邻选择器 :e元素后所有的f元素
    e~f 兄弟选择器 e后面所有的兄弟元素f
    伪类选择器
    :link 访问前
    :hover 鼠标悬停时
    :active 点击激活状态
    :visited 访问后
    :focus 获取焦点时
    UI元素状态伪类选择器
    e:checked 选中状态 (只针对单选按钮和复选框)
    e:enabled 可编辑状态 (默认状态)
    e:disabled 禁用状态
    属性选择器
    e[attr]
    e[attr="value"]
    e[attr~="value"] 包含空格及value的e元素
    e[attr|="value"] 有分隔符-的e元素
    e[attr^="value"] 以value开头的e
    e[attr$="value"] 以value结尾的e
    有[attr*="value"] attr中包含value的e标签
    伪对象选择器
    e:first-letter 第一个字符
    e:first-line 第一行
    e:before 前
    e:after 后
    e::selection 选中状态时触发的效果
    结构伪类选择器
    :root 根选择器
    e:first-child 第一个子元素e
    e:last-child 最后一个子元素e
    e:only-child 唯一的一个子元素e
    e:nth-child(n) 第n个子元素e n=odd even 数字 公式
    e:nth-last-child(n) 倒数第n个子元素e
    e:first-of-type 第一个同类型元素
    e:last-of-type 最后一个同类型元素
    e:only-of-type 唯一同类型元素
    e:nth-of-type(n) 第n个同类型元素e n=odd even 数字 公式
    e:nth-last-of-type(n) 倒数第n个同类型元素e
    e:empty 空元素
    ————————————————————————————
    box-shadow 盒子阴影
    box-shadow:水平位置 垂直位置 模糊距离 阴影大小 阴影颜色 [内置或外置]
    background-origin:border-box,padding-box,content-box
    background-clip::border-box,padding-box,content-box
    background:linear-gradient(方向,颜色,……)线性渐变
    background:repeating-linear-gradient(方向,颜色……) 重复线性渐变

径向渐变
background:radial-gradient(中心坐标,形状 大小,颜色……)
大小:
/closest-side 最近的边
farthest-side 最远的边
closest-corner 最近的角
farthest-corner 最远的角
/
形状:
circle 或 ellipse(默认椭圆)
background:repeating-radial-gradient() 重复径向渐变

多列
column-count:分列数
column-gap:栏间距
column-rule:分隔线
弹性盒子
父元素中添加
display:flex; display:-webkit-flex;
子元素排列方式 :(父元素添加)
justify-content:flex-start/flex-end/center/space-between/space-around
子元素垂直对齐方式(父元素中添加)
align-item:flex-start/flex-end/center/baseline/stretch
顶端/底端/居中/基线/默认auto
子元素换行方式(父元素添加)
flex-wrap:nowarp/wrap/wrap-reverse/initial/inherit
单行(不换行,会溢出)/多行,自动换行/换行,反转排列/初始化默认效果相似/默认(不换行)
align-content 设置行对齐方式 (添加到父元素中)
前提条件是flex-wrap为wrap时才可以用
align-content:stretch/flex-start/flex-end/center/space-between/space-around
默认/顶端、底端、居中、两端、平均分布
子元素顺序(子元素添加)
order:1,值越小越靠前 可以为负值
子元素对齐(子元素添加)
margin:auto;对象自动留白
按比例分配元素(子元素添加)
flex:比例值
如:
div>div*3
子元素按顺序添加flex:1 flex:3 flex:1 结果:1:3:1

另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


分享名称:web前端开发H5知识点-创新互联
当前地址:http://bjjierui.cn/article/hjjps.html

其他资讯