vip10-1202作业

问题一:块级元素和行内元素分别有哪些?动手测试并列出4条以上的特性区别?


常见块级元素:<p>,<h123456>,<ul>,<ol>,<li>,<table>,<td>,<tr>,<th>,<form>
常见行内元素:<img>,<a>,<textarea>,<em>,<input>,<button>,<code>,<script>,<label>.
块级元素和行内元素的区别:

1.块级元素占据一整行空间,行内元素并排排列。只占据本身内容的空间

2.块级可以包含块级和行内,行内只能包含文本和行内

3.宽高,只对块级元素设置生效,对行内元素无法设置,设置也不生效

4.块级元素正常设置margin和padding,行内元素不能通过margin-top和padding-top设置行高.如果设置背景浏览器承认存在,但是周围元素会覆盖掉所设置的上下间距。

代码演示

问题二:什么是 CSS 继承? 哪些属性能继承,哪些不能?


继承性:特定的CSS属性向下传递到子孙元素。
可以继承的属性:
文本相关的:font开头的 text开头的,
列表相关的:list开头
color也能继承,但是对于a标签来说,color和text-decoration是无法继承的,只能单独设置。
对于h1标签,text-size是不能继承的。

无继承性的属性:
1、display:规定元素应该生成的框的类型
2、文本属性:
vertical-align:垂直文本对齐
text-decoration:规定添加到文本的装饰
text-shadow:文本阴影效果
white-space:空白符的处理
unicode-bidi:设置文本的方向
3、盒子模型的属性:width,height,margin ,border,padding。
4、背景属性:background,background-color,background-imag,background-repeat.
5、定位属性:float,clear,position,top,right,bottom,left,overflow,clip,z-index。

问题三:CSS 实现一个三角形


先设计一个盒模型,画一个矩形,然后height和width设置为0.border根据需求均分数值,最后把不必要的边框设置为透明。

triangle

问题四:单行文本溢出。。。如何实现


代码

问题四:px, em, rem 有什么区别


px:像素值(chrome里面最小12px,小于12px没有效果)。
em:相对父元素的倍数大小,若父元素未声明,则追溯到上一级父元素。
ps:(任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合: 1em=16px。那么12px=0.75em,10px=0.625em。为了简化font-size的换算,需要在css中的body选择器中声明Font-size=62.5%,这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10,然后换上em作为单位就行了。)

rem:相对html根节点(默认16px)倍数大小,若根节点未声明,则使用默认值16px。

演示

该例子中,div子元素2em追溯到上一级2em也就是4倍根节点,40px。2rem,相对于根节点2倍大小,并且根节点声明为10px,所以2em表现为20px

问题五解释下面代码的作用?为什么要加引号? 字体里的数字符号代表什么?


1.代码作用:
font:12px/1.5 意思是body的字体设置为12px。行号是12x1.5的像素值。
tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif代表浏览器从tahoma开始以依次识别,用户电脑存在即采用,不存在会查找第二种arial,以此类推。
2.因为单词之间存在空格,避免浏览器解析成多个词汇。所以用引号括起来表示单一的名词。
3.数字符号代表Unicode.\5b8b是宋的code码,\4f53代表体。

问题六


代码

问题七


代码

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 217,509评论 6 504
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,806评论 3 394
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 163,875评论 0 354
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,441评论 1 293
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,488评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,365评论 1 302
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,190评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,062评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,500评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,706评论 3 335
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,834评论 1 347
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,559评论 5 345
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,167评论 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,779评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,912评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,958评论 2 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,779评论 2 354

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,751评论 1 92
  • 一 外部式css样式 (也可称为外联式)就是把css代码写一个单独的外部文件中,这个css样式文件以“.css...
    KunMitnic阅读 939评论 0 1
  • •前端面试题汇总 一、HTML和CSS 21 你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么? ...
    Simon_s阅读 2,220评论 0 8
  • 本课来自http://www.imooc.com/learn/9请不要用作商业用途。 HTML5 HTML介绍 H...
    PYLON阅读 3,225评论 0 5
  • 想起来第一次离家的时候,心里是多么的开心啊!因为可以远离父母了,自己解放了,自由了,不用在听唠唠叨叨的话了,就算自...
    向上居士阅读 464评论 8 3