关闭

css(二)盒子模型和不同元素类型

标签: css
422人阅读 评论(0) 收藏 举报
分类:
  1. 块级元素
    <div>、 <p>、<h1>、<form>、<table>、<ul>、<li>
    转化为块级元素 display:block;
    特点:(1)每个块级元素都从新的一行开始,并且其后的元素也另起一行。(2)元素的高度、宽度、行高以及顶和底边距都可设置。(3)元素宽度在不设置的情况下,是它本身父容器的100%(和父元素的宽度一致),除非设定一个宽度。
  2. 内联元素<span>、<a>、<label>、 <strong>、<em>
    display:inline
    特点:(1)和其他元素都在一行上(2)元素的高度、宽度及顶部和底部边距不可设置(3)元素的宽度就是它包含的文字或图片的宽度,不可改变
  3. 内联块状元素
    <img>、<input>
    display:inline-block
    特点:(1)和其他元素都在一行上(2)元素的高度、宽度、行高以及顶和底边距都可设置。
  4. 盒子模型(块状元素具有)
    1. 边框: border:2px solid red;
      border-width:2px;
      border-style:solid;//dashed(虚线),dotted(点线)
      border-color:red;

      注:可以只为一个边框设置样式,即不同边框设置不同的样式
    2. 这里写图片描述
    3. 填充和边界
      padding:20px 10px 15px 30px;//上右下左
      margin:20px 10px 15px 30px;
0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:379281次
    • 积分:6402
    • 等级:
    • 排名:第3785名
    • 原创:345篇
    • 转载:8篇
    • 译文:1篇
    • 评论:75条
    博客专栏
    最新评论