好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

浅谈html5标签css3的常用样式

< ;m eta n am e=''>

name:有如下6个值:
application-name:文档名 或者 应用名,整个文档只能包含一个值。
author:文档作者
description:文档描述
generator:生成文档的程序。
keywo rds :网页关键字,用英文逗号分隔。


<a hr ef="https://www.js-code .COM "></a>

href:路径
< img src=" .. /img/a. jpg " alt="此图 无法显示 " border="1px solid red " width="400" h ei ght="250"/>
src:图片路径

<table>标签的属性
Border 边框
Cellspacing 表格 外边距
Cellpadding 表格 内边距
Align&nbs p; 位置
Bgcolor:背景色
Background:背景图片
Bordercolor: 边框颜色

table中 <tr></tr>

<td colspan="2"></td>  colspan 跨2列

        rowspan  跨  行

<input ty PE ="">

 type值

text  文本

password 密码

radio 单选

checkbox 多选

reset 重置

file 文件上传

s ub m IT 提交表单

image 图形提交

button 普通按钮

分组下拉

XM L/HT ML Code 复制内容到剪贴板

< select   @H_ 360 _76@name = "city"   id = "city" >         < optgroup   label = "山东" >             < option   value = "yt" > 烟台 </ option >             < option   value = "qd" > 青岛 </ option >             < option   value = "wh" > 威海 </ option >         </ optgroup >         < optgroup   label = "北京" >             < option   value = "bj" > bj </ option >             < option   value = "tam" > tam </ option >             < option   value = "zong" > zong </ option >         </ optgroup >    </ select >   

文字区域textarea

XML/HTML Code 复制内容到剪贴板

< textarea   name = "textarea"   id = "textarea"   cols = "30"   rows = "10"   readonly = "readonly"             disabled = "disabled" >        1 </ textarea >   


cols 宽 度 rows 高度  readonly 只读

css样式
字体、 字号 :
font(缩写形式)
font-weight (粗细) 正常 (normal) 粗体 (bold) 斜体 (italic)
font -s ize(大小)
font-f ami ly(字体 系列 )
font-style(字体样式)

字体颜色 :
color
opacity (透明度 css3)

行距、对齐等:
line-height (行高)
text-align (对齐)
letter-spacing (字符间距)
text-decoration (文本修饰 )
overflow  超出的部分隐藏
text-overflow

text-overflow文本裁剪  clip裁剪文本时不添加...  ellipsis 裁剪时加...  注意:不换行和over-flow控制

text-shadow 阴影
text -i ndent

背景属性 :
background (缩写形式)
background-color(背景色 )
background-image(背景图 )
background-repeat(背景图重复方式 )
background-position(位置坐标、偏移量)


列表常用

list-style: none无风格 disc实心 圆 circle空心圆 square 实心正方形 decimal 数字

盒子 属性:
m arg in(外 边距 /边界)    以上方为主 可写1、2、4个值
border(边框)
padding(内边距/填充 )

后可加 -t op 等 方向

border-radius 边框圆角

box-shadow  阴影

变形 效果:transform

transform-ori gin 指定变换的起点

none无变换

translate(长度值或百分比) trans latex translateY 在水平、垂直方向平移

scale(数值)scaleX scaleY 在水 平方 向、垂直方向或两个方向上缩放

rotate(角度)旋转元素

skew(角度)skewX skewY  在水平方向、垂直方向或两个方向上使元素倾斜一定的角度

matrix 自定义

过渡效果:transition

transition- PR operty 指定过渡的css属性 默认值 all

transition-duration 完成过渡的时间

transition-timing-function 指定过渡函数  缓动效果默认值ease 等同于(0.25, 0.1, 0.25, 1.0)

transition-delay 指定过渡 开始 出现的延迟时间

@keyframes:定义一个动画

animation

CSS Code 复制内容到剪贴板

<style>                .t5{                transition: 5s ease-out  all ;    /*过渡   ease    in 加速   out减速*/            } /*transition-delay延迟*/            .t 5: hover{                   transform: skew(45 deg ,45deg)            }            @keyframes key {                0%{                     background-color :  red ; width :  200px ; height :  200px ;                }                25%{                     background-color : orange; width :  100px ; height :  100px ;transform: rotate(-90deg);                }                50%{                     background-color :  yellow ; width :  60px ; height :  60px ;transform:  none ;                }                75%{                     background-color :  green ; width :  120px ; height :  120px ;transform:  none ;                }                100%{                     background-color :  blue ; width :  200px ; height :  200px ;transform: rotate(360deg);                }            }            .kt{                animation:key 1s;                /* animation-iteration-count: infinite;*/ /*无限循环*/                 background-color :  yellow ;                 width :  200px ; height :  200px ;               }        </style>       <div class= "kt t5" ></div>  

以上就是小编为大家带来的 浅谈 html5标签css3的常用样式全部内容了,希望大家多多支持~

总结

以上是 为你收集整理的 浅谈html5标签css3的常用样式 全部内容,希望文章能够帮你解决 浅谈html5标签css3的常用样式 所遇到的问题。

如果觉得 网站内容还不错, 推荐好友。

查看更多关于浅谈html5标签css3的常用样式的详细内容...

  阅读:17次