html入门笔记02

2019.11.19

1. img

   属性	值	描述
   src	URL	规定显示图像的 URL。
   alt	text	规定图像的替代文本。
   title	text	鼠标移入出现提信息（任何标签可使用）

2. textarea 定义多行的文本输入控件

   属性	值	描述
   cols	number	规定文本区内的可见宽度。
   rows	number	规定文本区内的可见行数
   placeholder	text	规定描述文本区域预期值的简短提示。

3. contenteditable 属性规定元素内容是否可编辑

   值	描述
   true	规定元素可编辑。
   false	规定元素不可编辑。

4. css选择器

   • 元素选择器（不常用）
   • 类名选择器（推荐使用）class=“…” . …
   • id选择器：id="…" #…
   • 后代选择器：
   • 子代选择器：只选儿子

   选择器	例子	例子描述
   :link	a:link	选择所有未被访问的链接。
   :visited	a:visited	选择所有已被访问的链接。
   :active	a:active	选择活动链接。
   :hover	a:hover	选择鼠标指针位于其上的链接。

5. CSS 外边距属性（Margin）上右下左顺时针

   属性	描述
   margin	在一个声明中设置所有外边距属性。
   margin-bottom	设置元素的下外边距。
   margin-left	设置元素的左外边距。
   margin-right	设置元素的右外边距。
   margin-top	设置元素的上外边距。

6. CSS 内边距属性（Padding）上右下左顺时针

   属性	描述
   padding	在一个声明中设置所有内边距属性。
   padding-bottom	设置元素的下内边距。
   padding-left	设置元素的左内边距。
   padding-right	设置元素的右内边距。
   padding-top	设置元素的上内边距。

7. 一个元素水平居中，三要素：

   • 块级元素
   • 有宽度
   • 左右外边距设置为auto

8. HTML存在三种形式

   • 行内元素：a span (不能设宽高)
   • 块级元素：h1-h6 div p
   • 行内块元素：img

9. 行内元素特征

   • 不能设置宽高（不膨胀，易满足）
   • margin上下不生效，左右生效（安分守己，偶尔小性子）
   • padding所有生效

10. 块元素特征

    • 宽高能设置

    • 独占一行

    • margin四个方向都生效

    • padding四个方向都生效，而且把块级元素撑大

      解决方法：i: box-sizing:border-box;

      ​ ii: 直接裁掉。

11. margin重合解决方法

    • 给父盒子加边框

      边框设置为透明：1.rgb（，，，0）2.transparent

    • 给父盒子加1px的padding-top

    • overflow:hidden