标签:
<head> <meta name=‘keywords‘ conntent="关键字,关键字2"> #网页关键字 <meta name=‘description" content=‘介绍‘> #描述网站内容 <meta http-equiv="Refresh" content="2;URL=https://www.baodu.com"> #2秒后刷新网页,跳转到百度页面 <meta charset="UTF-8"> #定义网站编码格式 <meta http-equic="content-Type" content=""> #与上一个一样,只不过不是简写! <link rel="icon" href=‘链接或者路径‘> #设置标题图片 <title> </title> #浏览器标题 </head> #浏览器标题等设置
<body> <a></a> #链接 <h1></h1> #标签(他有h1-h6) <div></div> #盒子 <img /> #加载图片 <hr /> #水平线 <br /> #换行符 <ul> #无需列表 <li> #列表中的每一项 </ul> <ol> #有序列表 <li> #列表中的每一项 </ol> <dl> #定义列表 <dt> #列表标题 <dd> #列表项 </dl> <table> #表格 <thead>#表头,简写不需要 <tr>#行 <td>aaa</td>#行名 <td>bbb</td> <td>ccc</td> </tr> </thead> <tbody>#内容,简写不需要 <tr> <td>aa</td> <td>bb</td> <td>bb</td> </tr> </tbody> </table> <form> #表单 #最常用的事input元素 <input \>#自闭和标签 </form> </body>
<img src=‘路径‘ height=‘高‘ width=‘宽‘ alt=‘加载失败提示什么‘ title=‘鼠标移动过去提示信息‘ /> <a href=‘url或者#id跳到固定位置‘ name:‘定义页面书签‘ target:"_blank#重新生成一个页面">提示语</a>
<table border=‘数字‘> #定义表格样式 <table cellpadding=‘数字‘> #内边距 <table cellspacing=‘数字‘> #外边距 <table width=‘px、%‘> #表格的宽度 <table stypl=‘height:‘px、%‘> #表格的长度 <td rowspan=‘一列占几行‘>1,2<td> <td colspan=‘一行占几列‘>1,2<td>
action=‘提交内容到那里‘ enctype=‘multipart/form-data‘ #上传文件的时候必须声明 method=‘提交方式默认是get‘(get:1.提交的键值对,放在地址栏中url后面. 2.安全性相对较差. 3.对提交内容的长度有限制 post:1.提交的键值对,不在地址栏. 2.安全性相对较高. 3.对提交内容的长度理论上无限制. ) input属性: <input type=‘text‘ name=‘name‘ vlaue=‘用户不写默认为这里内容‘\> #以文本格式让用户输入内容,给服务端传的时候key是name type类型: submit #按钮 value #按钮名称 password #密文 name #key名 radio #单选框 name #key名有多个选择那么name需要一样用户只能选一个 value#传给服务端的值 checkbox #复选框 name #key名和radio一样用户可以多选 value#传给服务端的值 button #在html里没有意义就是一个按钮没有功能,加上JS便可以使用 value#和submit一样 file #提交文件 value #文件名 select属性: <select name=‘key‘ multiple size=‘1‘>#下拉列表,发向服务器的时候keu,可多选(默认单选),默认显示几个。 <optgroup label=‘内容‘>#它相当于将现在的内容分组 <option value=‘对应的值‘>1</option>#选项,发送给服务端key的value <option>2</option> <option>3</option> </optgroup> </select> textarea属性:他是多行输入,而input的text为单行输入,常用于写备注、签名等。。。 label属性: 组合input的文本使用,单机名称光标到文本位置 fieldset属性: 做一个框,将内容放到里面
< #小于 > #大于 " #引号 © #版权号 ® #注册标志
#:ID
E:标签选择器,匹配所有使用E标签的元素E{ color:green; }
或:标签,标签
.:class
或:标签.class名
标签或class 标签 控制标签或class所有的后代标签
标签或class>标签 控制标签或class的子标签
*:通用元素选择器,匹配任何元素* { margin:0; padding:0; }
属性名=‘属性值‘ #在定义css的时候需要[属性名]或者[属性名=属性值] |=‘boy‘ #用于这个属性名的值是以boy开头的,其格式必须是‘a-b‘ ^=‘boy‘ #用于这个属性名的值是以boy开头的 $=‘boy‘ #用于这个属性名的值是以boy结尾的 *=‘boy‘ #用于这个属性名的值中包含boy的 p:before #在每个 <p> 元素的内容之前插入内容 p:before{content:"hello";color:red} p:after #在每个 <p> 元素的内容之前插入内容 p:after{ content:"hello";color:red}
a:link #没有接触过的链接
a:hover #鼠标放在链接上的状态
a:active #在链接上按下鼠标时的状态 在链接上按下鼠标时的状态
a:visited #访问过的链接 在链接上按下鼠标时的状态
a:focus #在获取焦点的时候!
fonut-size #字体大小 fonut-family #字体 <h1 style="font-style: oblique">老男孩</h1> #斜体
background-image:url(图片地址) #设置图片背景
background-repeat: repeat-x; no-repeat; 一行,一张,
backgrond-position: right center #图片右侧居中
text-align=center #文本居中
line-height=100px #100px的高度输入文字
text-indent=30px #实现文本开头缩进的功能
letter-spacing: 10px; #将文本内容每一个按照10px分割
word-spacing: 20px; #将文本每一个单词按照20px分割
direction: rtl; #把文本方向设置为“从右向左”
text-transform: capitalize;lowercase;uppercase; #文本中的每个单词以大写字母开头,定义无大写字母,仅有小写字母,定义仅有大写字母。
border:solid 2px rad #边框实线,3像素,红色
dashed #虚线
list-style:none #去掉无序列表的点
decimal-leading-zero; #数字
circle; #空心圆
dispaly:inline #将块级标签改成内联标签
dispaly:block #将内联标签改成块级标签
dispaly:none #隐藏
dispaly:inline-block #将块级标签改成内联标签并且可以设定高宽
padding #控制盒子与内容之间的距离
margin #控制盒子与盒子之间的距离
float:left、right #浮动盒子方向
clear:left、right、botb #清除左浮动、清除右浮动、清除所有浮动
position:static、fixed、relative、absolute
static(默认排版)、fixed(根据html定位)、absolute(根据relative来进行相对定位)relative(定位)
visibility:hidden #隐藏并且占高度
visible #显示
dispaly:none #隐藏不占高度
overflow:hidden #将超出块大小大小的内容隐藏
auto #超出后使用滚动条查看内容
opacity:0.6 #透明度为60%
!important #后面的样式不可更改这里的样式
z-index #显示权重值
标签:
原文地址:http://www.cnblogs.com/WuYongQi/p/5702903.html