html

作者: writ | 来源:发表于2019-06-12 11:46 被阅读0次

    换行 <br />
    空格 &nbsp
    “<” 和 “>” 的字符实体为 < 和 >
    html块
    1、div标签 块元素,表示一块内容,没有具体的语义。
    2、span标签 行内元素,表示一行中的一小段内容,没有具体的语义。

    含样式和语义的标签
    1、em标签 行内元素,表示语气中的强调词
    2、i标签 行内元素,原本没有语义,w3c强加了语义,表示专业词汇
    3、b标签 行内元素,原本没有语义,w3c强加了语义,表示文档中的关键字或者产品名
    4、strong标签 行内元素,表示非常重要的内容

    语义化的标签
    语义化的标签,就是在布局的时候多使用语义化的标签,搜索引擎在爬网的时候能认识这些标签,理解文档的结构,方便网站的收录。比如:h1标签是表示标题,p标签是表示段落,ul、li标签是表示列表,a标签表示链接,dl、dt、dd表示定义列表等,语义化的标签不多。

    table常用标签
    1、table标签:声明一个表格

    2、tr标签:定义表格中的一行

    3、td和th标签:定义一行中的一个单元格,td代表普通单元格,th表示表头单元格

    table常用属性:
    1、border 定义表格的边框

    2、cellpadding 定义单元格内内容与边框的距离

    3、cellspacing 定义单元格与单元格之间的距离

    4、align 设置单元格中内容的水平对齐方式,设置值有:left | center | right

    5、valign 设置单元格中内容的垂直对齐方式 top | middle | bottom

    6、colspan 设置单元格水平合并

    7、rowspan 设置单元格垂直合并

    常用的应用文本的css样式:

    color 设置文字的颜色,如: color:red;

    font-size 设置文字的大小,如:font-size:12px;

    font-family 设置文字的字体,如:font-family:'微软雅黑';

    font-style 设置字体是否倾斜,如:font-style:'normal'; 设置不倾斜,font-style:'italic';设置文字倾斜

    font-weight 设置文字是否加粗,如:font-weight:bold; 设置加粗 font-weight:normal 设置不加粗

    font 同时设置文字的几个属性,写的顺序有兼容问题,建议按照如下顺序写: font:是否加粗 字号/行高 字体;如: font:normal 12px/36px '微软雅黑';

    line-height 设置文字的行高,如:line-height:24px;

    text-decoration 设置文字的下划线,如:text-decoration:none; 将文字下划线去掉

    text-indent 设置文字首行缩进,如:text-indent:24px; 设置文字首行缩进24px

    text-align 设置文字水平对齐方式,如text-align:center 设置文字水平居中
    1、颜色名表示,比如:red 红色,gold 金色

    2、rgb表示,比如:rgb(255,0,0)表示红色

    3、16进制数值表示,比如:#ff0000 表示红色,这种可以简写成 #f00

    css元素溢出

    当子元素的尺寸超过父元素的尺寸时,需要设置父元素显示溢出的子元素的方式,设置的方法是通过overflow属性来设置。
    overflow的设置项:
    1、visible 默认值。内容不会被修剪,会呈现在元素框之外。
    2、hidden 内容会被修剪,并且其余内容是不可见的,此属性还有清除浮动、清除margin-top塌陷的功能。
    3、scroll 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。
    4、auto 如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。
    5、inherit 规定应该从父元素继承 overflow 属性的值。

    display属性

    display属性是用来设置元素的类型及隐藏的,常用的属性有:
    1、none 元素隐藏且不占位置
    2、block 元素以块元素显示
    3、inline 元素以内联元素显示
    4、inline-block 元素以内联块元素显示
    浮动特性

    1、浮动元素有左浮动(float:left)和右浮动(float:right)两种

    2、浮动的元素会向左或向右浮动,碰到父元素边界、浮动元素、未浮动的元素才停下来

    3、相邻浮动的块元素可以并在一行,超出父级宽度就换行

    4、浮动让行内元素或块元素自动转化为行内块元素

    5、浮动元素后面没有浮动的元素会占据浮动元素的位置,没有浮动的元素内的文字会避开浮动的元素,形成文字饶图的效果

    6、父元素内整体浮动的元素无法撑开父元素,需要清除浮动

    7、浮动元素之间没有垂直margin的合并

    javascript调试程序的方法

    1、alert

    2、console.log

    3、document.title

    相关文章

      网友评论

          本文标题:html

          本文链接:https://www.haomeiwen.com/subject/omycfctx.html