html questions and summary

5 days… about 12h
html quiz 92 23/25 yes!!
h5 quiz 84 point 21/25 yes!!!! acrosss
2016-7-7
4h

h5

  1. you can create a new tag by script in IE 9.
  2. lt IE 9, we use the js HTML5Shiv, authored by Sjoerd Visscher.
  3. section and article are the same looks. NO Different.
  4. 结构化 webpages header.
  5. artticle section div, 少用 div 吧
  6. Try to avoid code lines longer than 80 characters.
  7. pace-less is easier to read, and groups entities better together:
  8. a canvas has no border and no content. like a gl….
  9. js 竟然可以画 东西 哈哈哈
  10. how drag a text? p seems not draggable.
  11. what’s the different between local storage and application cache?
  12. js worker is funny too. Define a worker outside, and in the page, use instance a Worker, then handle the posted message.
form
  1. form, sounds like a table or something 表格。but it is a container to collect user input. saic. let talk abou our new friend, tag element, form. let us check, what it will be inside a form pair.
  2. input element is them most important form element.
  3. what’s the different between the id and name attribute?
  4. each input arean should have a name attribute.
  5. fieldset + legend give a surounding box with a title too, grouping the input elements.
  6. select+option givec you the dropdown menu.
  7. button is als an element, peers to input select
  8. input+datalist give a dropdown selection for an input area. the connection is a list=”id” attribute in input and an id attribute in datalist.
  9. keygen is more secure. It will generate a private key and public key. Private key is stored locally, while the public key will send to sever. The sever will the generate a certificate, bo authenticate the user later.
  10. name attribute in input is for parameter pair to post or get to server.
  11. output is just for the calculatin??? it
  12. input is a single element!!!!
  13. radio is a single selection but checkbox is 0 or more.
  14. My god, input type=”color” can easily select the color and give the rgb value!!!!!! fuck amazing!!!!
  15. for the design principle, h5 has emplementd lots of modern requiment. such as the restrict attribute of inputbox, for an example, pattern, required, or step.
  16. What’s the different between disable and readonly? the disable won’t submit as a parameter.
  17. An input outside the form pair, can declare the relationship by form attribute.
  18. the formenctype is cool.
  19. siz and maxlength: size for apperance, and maxlength contols the real input.

2016.7.6
UtF8 计算机的字符编码,还是围绕人转呢。 描述人的字符。

responsive

cool cause it’s necessary!!!

javascript

the first thing is to use js with tag script, second is noscript to handle the exceptions.

iframe
  1. it can be show different pages!!!!
  2. it can be used for the target of an link!!

    block class

  3. block has inline and block things such as div and span
  4. div + class is powerful.
  5. class canbe define withprefix . is there any name space?
  6. can one element belongs to several class???
    image
  7. height and width needs to be specified to avoid the flicker while the image loads.
  8. 2 ways to specify the width and height. style=”width:12px;height:12px;” width=”12” height=”12”, but style wyas is recommended, because it prevent the style sheet changes the size of img.
  9. float attribute is funny. to describe the posotion relation with text around
  10. image map is fucking cool. the connetion between an img and map is usemap=”#mapname” name=”mapname
    table
  11. table has tr td th sub element
  12. style can be declared like table, td, th{ border:1px;}
  13. table把1维的数据,二维展开
  14. colspan rowspan
  15. caption is the table header on top of the table.
  16. table#t01 tr:nth-child(odd) 这个碉堡了。在style里,指定了#t01的id, 多一个空格会怎样? 没事。
list
  1. list show the format we want to show in our document
  2. unordered list, mark type specified by, style=”list-style-type:circle”
  3. ordered list, type 1,2,3 or a.b.c. type=”1” or type=”a”
  4. dl dt dd show term description
  5. The menu list is amazing!!!! ul#menu li a:hover{color:orange} li a 写在一起什么意思? 不带li 效果也一样啊!!!!

2016.7.5 3hours

formating
  1. elements such as sub sup and bold italic del ins, too heavry for just formating
  2. I wonder ins looks like what? wechat name must support something like superscript
  3. ao, strong is brighter than bold? NO, it’s the same. but atom renders different.
  4. Itlic means without any importance!!!
  5. H2O this is super cool!!!!
quotation
  1. q, browser add quation marks around, while blockquote indent.
  2. blockquote has an attribute cite, which contains the URL of the quotation.
  3. bdo is a pitty element tag. has an attribute, dir=”rtl/ltl”
  4. I think abbr is fun, casue i have an abbregative nickname B.A.D.
computer code
  1. kbd, is a strange abbregation for keyboard input. File | Open…
  2. samp sample output, my god , such a funny nickname.
  3. code var is great. FUCK
  4. int i = 100;
comment
  1. can you see the comment above?
  2. This is conditional comments. reeally some sense of programming.
    ######
color
  1. this is the color i mixed rgb(255,144,22)
css
  1. css is for color and style. cascade styles sheet.
  2. There are 3 kinds. inline, internal, external, style attribute, style element, and css document specified by link.
  3. Stye element inside a header section, what if there is no header section? Nothing, it still works. Color means text color, not others.
  4. External styling can define styles for many pages, and if you change it, the entire website appears different!
  5. Link element is a single one. It has two attribute. One is rel, one is href. I don’t know what does it mean, whatever, I will learn it in css tutorial.
  6. hr border:1px solid rgb(255,122,22)
  7. Oh, No.6 is the htlm box model, the box has border padding key value pair.
  8. Margin defines the spaces outside the box, and padding defines the inside spaces.
  9. id attribute is funny. ID specifies the element, and it could be referenced in css. It’s amazing that several elements could share the same id.
  10. css is amazing. The id thing, is just what i am thinking about. I am defining a Macro. every elements can use it!!!!
  11. There is also a class attribute, i think it can be down by id too. of course. In my opinion, id is more flexible here. But of course, class make the code more neat and readable.
  1. Now it’s the most important part of html, links!!!!!
  2. why the tag name is a?? because it’s the NO.1 thing in HTML.
  3. href can be a local link.
  4. the css style can define state of a, using format as: a:visited{color:red;background-color:transparent;text-decoration:underline}
  5. I love the w3cschool turorial, because, for the second time, it hits what I am thinking about!!! This time, it the target attribute. Target speifies where to open the page, blank, for an example.
  6. Maybe, i am really good at coding.

    remove the underline appears in the link

    a:link{
    text-decoration:none;
    }

2016.7.4

  1. Meta data means the data about data.
  2. html meta tag contains head title style and link.
  3. Stye tag specifies the css things inner, while the link tag tell the outside css document.
  4. The pre tag keeps/preservers the linebreak and space for, i think , poems.
  5. style seem to an attribute also. note only tag ,but also attribute? not only element but also attribute!
  6. style has some name:value; pairs such as:
    • color
    • background-color
    • font-family
    • font-size 200%
    • text-align 这个 为什么不是 text-alignment 呢,瞎鸡巴简写

2016.7.2

  1. br means line break. I have use a p /p pairs. haha
  2. element is things like html p
  3. all elements have attribute
  4. img is a non-pare element
  5. the src in img, the value of src can like a local path, or a network uri
  6. title attribute is for every elemnts, used for tool tips.

attributes often used they are:

title

src

style inline css

id the unical id for an element

href the url for an adrress used in tag ‘a’

disabled

alt

2016.7.2
Tomorrow, start from Headings.