前端html+css标签简介（可能就我自己看的懂-。-）

标签：换行   java   hidden   val   cell   src   十六进制   居中   checkbox   

标签集合

# html

文字标签：修改样式
    -<font></font>
    -属性：size：大小，范围1-7，大于7时默认7
           color：颜色，英文单词或者十六进制(editplus中有颜色工具)

注释标签：java注释有几种？3
    html注释：<!--   xxxxx此为注释   -->

标题标签：
    <h1></h1><h2></h2>...<h5></h5>
    <h1>标题一</h1>，可以自动换行，字体大小依次变小

水平线标签：<hr/>
    -属性：size：线的粗细
           color：线的颜色
    <hr size="5" color="blue"/>

特殊字符：转义：
    < : &lt;
    > : &gt;
    & : &amp;
    空格 : &nbsp;

列表标签：<dl></dl>:表示列表的范围
               <dt></dt>上层主内容
           <dd></dd>下层子内容
      <ol></ol>有序列表的范围
           <li></li>具体内容
      <ol type="a"></ol> type设置排序方式
      <ul></ul>无序列表范围
      <ul type="circle"></ul> type设置排序方式

图像标签：<img src="图片的路径"/>
    -src:图片的路径
    -width:图片的宽度
    -height:图片的高度
    -alt:显示图片上的文字，鼠标移到图片上停留片刻(有些浏览器不支持)

路径介绍：
    绝对路径：使用路径全名
    相对路径：1.从该html的同级目录的路径开始（同级或下层目录）
        2.用../回到上级目录出发（上层目录）

超链接标签：
    链接资源：<a href="链接路径">显示在页面上的内容</a>
    href:资源地址（#无效化）
    target:设置打开方式，默认在当前页面打开
        _blank:在新窗口打开
        _self:在当前页面打开
    定位资源：先定义一个位置
        <a name="example">ok</a>，回到该位置用链接
        引入标签pre,原样输出

表格标签：<table></table>:表格的范围
    tr：表格中的每一行；td：每一行的每一个单元格
    中有tr中有td:<tr><td></td></tr>
    属性：border：表格线的粗细
        bordercolor：表格线的颜色
        cellspacing：单元格之间的距离
        width和height：表格的大小
        align设置文字位置：left，center，right
    th：代替td并实现居中和加粗
    <caption></caption>:表格标题
    合并单元格：-rowspan：跨行
        -colspan：跨列 colspan="3"跨三列

表单标签：<form></form>:定义表单的范围，属性action提交数据，默认当前页面，属性method，get和post默认get，属性enctype，文件上传需用，下面每一项中要有属性：name
        输入项：<input type="类型"/>
        普通输入项：<input type="text"/>
        密码输入项：<input type="password"/>
        单选输入项：<input tye="radio"/>属性：name需一样，value，checked="checked"默认选中
        复选输入项：<input type="checkbox"/>属性：name需一样，value，checked="checked"默认选中
        文件输入项：<input type="file"/>
        下拉输入项：<select>
                <option value="1">1</option>
                <option value="2">2</option>
                ...
                </select>
                selected="selected"默认选中
        文本域：<textarea></textarea>属性cols（列），rows（行）
        隐藏项：<input type="hidden"/>
        提交按钮：<input type="submit"value="注册"/>
            <input type="image" src="图片路径"/>（图片提交）
        重置按钮：<input type="reset" value="重置"/>
        普通按钮：<input type="button" value="普通">

其他标签：<b></b>加粗
    <u></u>下划线
    <i></i>斜体
    <s></s>删除线
    <p></p>段落
    <pre></pre>原样输出
    <sub></sub>下标
    <sup></sup>上标
    <div></div>自动换行
    <span></span>在一行显示

头标签：<title></title>标题
    <meta name="keywords"content="关键字">搜索引擎
    <meta http-equiv="refresh" content="时间；url=地址">多少时间后跳转到该地址
    <base target="_blank">所有链接都在新窗口打开
    <link>引入外部文件

框架标签：<frameset></frameset>
    -rows：按行划分<frameset rows="80,*">分两部分，第一部分80
    -cols：按列划分
    <frame name=""src="">
    只有在没有body是能用





# css


1.直接在每个标签后加style

2.<style type="text/css">
    div{
        background-color:blue;
        }
 </style>

3.在style标签里导入css文件（有些浏览器不起作用）
    @import url(路径);

4.使用link引入外部文件
    <link rel="stylesheet" type="text/css" href="css文件的路径"/>

由上到下，从外到内，优先级低到高

标签选择器
    div{
        background-color:red;}
class选择器
    <div class="x">aa</div>
    .x{background:red;}
id选择器
    <div id="y">aa</div>
    #y{backgeound:red;}

style优先级大于id选择器优先级大于class选择器优先级大于标签选择器

扩展选择器：
    关联选择器div p{...}嵌套时使用
    组合选择器div,p{...}设置相同样式时使用
    伪元素选择器：css中一些定义好的样式
        a:link{background-color:red}
        ：hover：active：visited

css盒子模型：
    边框：border:20px  soild  blue(大小，类型，颜色)
        top,bottom,left,right四种
    内边距：padding:20px
        上下左右分别设置
    外边距：margin:20px
        上下左右分别设置

css布局定位与漂浮：
    float：left和right放到对象左边或右边
    position：absolute：把对象从文档流拖出，可以用top，bottom等定位
        relative：不从文档流拖出，用top，bottom定位

前端html+css标签简介（可能就我自己看的懂-。-）

标签：换行   java   hidden   val   cell   src   十六进制   居中   checkbox   

原文地址：https://www.cnblogs.com/leaf-wind/p/11664057.html