CSS 面接の質問と回答
関連する比較
質問 26. Can I include comments in my Style Sheet?
Yes. Comments can be written anywhere where whitespace is allowed and are treated as white space themselves. Anything written between /* and */ is treated as a comment (white space). NOTE: Comments cannot be nested.
質問 27. What is the difference between ID and CLASS?
ID identifies and sets style to one and only one occurrence of an element while class can be attached to any number of elements. By singling out one occurrence of an element the unique value can be declared to said element.
CSS
#eva1 {background: red; color: white}
.eva2 {background: red; color: white}
HTML - ID
<P ID=eva1>Paragraph 1 - ONLY THIS occurrence of the element P (or single occurrence of some other element) can be identified as eva1</P>
<P ID=eva1>Paragraph 2 - This occurrence of the element P CANNOT be identified as eva1</P>
HTML - CLASS
<P class=eva2>Paragraph 1 - This occurrence of the element P can be classified as eva2</P>
<P class=eva2>Paragraph 2 - And so can this, as well as occurrences of any other element, </P>
質問 28. How to make text-links without underline?
a:link, a:visited {text-decoration: none}
or
...will show the links without underlining. However, suppressing the underlining of links isn't a very smart idea as most people are used to having them underlined. Also, such links are not spotted unless someone coincidentally runs a mouse over them. If, for whatever reason, links without underline are required background and foreground colors can be instead declared to them so that they can be distinguished from other text, e.g.;
a:link, a:visited {text-decoration: none; background: red; color: blue}
or
Both background and foreground colors should be specified as the property that is not specified can be overridden by user's own settings.
質問 29. How do you make a tool tip that appears on hover?
The most simple way is to use the 'title' attribute like this...
HTML
like this
CSS
a.tooltip {
position:relative;
cursor:help;
}
a.tooltip span {
display: none;
position:absolute;
top:1.5em;
left:0;
width:15em;
padding:0 2px;
}
a.tooltip:hover {
display:inline;
}
a.tooltip:hover span {
display:block;
border:1px solid gray;
background-color:white;
}
HTML
<a class="tooltip" href="#n">Karl Marx-info goes here-</a>
Without this part... a.tooltip:hover {
display:inline;
}
..it won't work in IE.
The "#n" in the link is to prevent the page from jumping to the top if the link is clicked. The "href" part is necessary as it won't work in IE without it.
質問 30. Which characters can CSS-names contain?
The CSS-names; names of selectors, classes and IDs can contain characters a-z, A-Z, digits 0-9, period, hyphen, escaped characters, Unicode characters 161-255, as well as any Unicode character as a numeric code. The names cannot start with a dash or a digit. (Note: in HTML the value of the CLASS attribute can contain more characters).
ユーザー評価で最も役立つ内容:
- What is CSS?
- What are Cascading Style Sheets?
- As a reader, how can I make my browser recognize my own style sheet?
- How do I combine multiple sheets into one?
- What are Style Sheets?