小编Alo*_*hci的帖子

使用自定义HTML标记

在我的HTML中,我很好奇是否在语义上正确使用唯一标识符,例如<toys> </toys>保存图像而不是图像<h2>.例如:

是否首选: <toys class="grid_4 push_2">&nbsp</toys>

与CSS:

    toys {
    background: url("toys.png") no-repeat scroll 0 0 transparent;
    width: 181px;
    height: 93px;
    margin-top: -8px;
    }
Run Code Online (Sandbox Code Playgroud)

而不是:我目前有: <h1 class="grid_4 push_2">&nbsp</h1>

与CSS:

    h1 {
    background: url("toys.png") no-repeat scroll 0 0 transparent;
    width: 181px;
    height: 93px;
    margin-top: -8px;
    }
Run Code Online (Sandbox Code Playgroud)

是否使用像<toys>语义正确的唯一标识符?

html css semantic-markup

43
推荐指数
4
解决办法
6万
查看次数

HTML 5验证是否值得一试?

人们普遍认为,验证HTML的最佳理由是确保所有浏览器都能一致且可预测地对待它.

但是,HTML 5草案包含两个规范.首先是作者规范,描述HTML作者应该使用的元素和属性,以及它们之间的相互关系.HTML 5页面的验证基于此规范.包含的元素和属性不是直接从HTML 4中提取的,而是需要从第一原则开始证明,这意味着某些HTML 4功能,例如<table>上的summary属性,<img>上的longdesc和profile属性在<head>上,目前不会出现在此草稿中.这些功能不被视为已弃用,它们根本不包含在内.(他们缺席草案仍然存在争议,尽管很快就会将其纳入其中.)

其次,草案定义了一个浏览器处理规范,该规范试图准确定义浏览器的解析器将如何处理它给出的任何字节流,而不管HTML的形成和有效性如何.这意味着当浏览器完全支持HTML 5时,可以预测任何浏览器如何处理HTML以获得更广泛的输入,而不仅仅是那些通过验证的输入.

特别是,因为HTML 5被定义为100%向后兼容当今的Web,所有有效的HTML 4和所有无效但常用的标记将继续处理与现在完全相同,无论是否HTML 5有效与否.

因此,至少,使用HTML 5,HTML 4或任何以前版本的HTML以及许多专有扩展的任何功能的任何人都可以确信他们的HTML将在所有浏览器中获得一致且可预测的处理.

鉴于此,将HTML 5限制为将验证的是否有任何意义,以及我们将从中获得哪些实际好处?

html html5

28
推荐指数
3
解决办法
9299
查看次数

制作<button>,这是HTML中的链接

基本上,我喜欢<input type="submit">风格的方式,添加一点CSS时可点击按钮.但是,常规按钮没有这样的样式,没有一些主要的CSS或JS它们没有这样的可点击性,你必须使用图像.

我通过使用表单操作将提交按钮设置为链接,但这需要我为每个按钮创建一个新表单.我怎样才能找到幸福的媒介?使用多个表单导致我的样式出现问题我似乎无法解决,除非我找到另一种方法来制作HTML中的链接按钮,这些按钮具有使其具有按下状态的默认样式(我并不是说浏览器默认设置).

有任何想法吗?

html css button

20
推荐指数
4
解决办法
8万
查看次数

单击滚动条时是否应运行单击处理程序

看看这些HTML片段:Jsfiddle

<style>
  div { 
    margin:20px; 
    border: 30px red solid; 
    padding: 20px; 
    background-color:green;
    overflow-y:scroll; 
  }
</style>

<div onclick="alert('div clicked');">click me</div>
Run Code Online (Sandbox Code Playgroud)

现在,如果用户单击Firefox或Chrome中的滚动条,则不会触发div元素上的单击处理程序.另一方面,在IE中,点击处理程序会触发.

哪种行为是正确的?是否在任何地方定义了预期行为

html javascript css onclick

15
推荐指数
2
解决办法
1112
查看次数

使用HTML表"summary"属性

HTML4.01(http://www.w3.org/TR/html401/struct/tables.html#adef-summary)的规范规定表摘要属性应包含"...表的目的和结构 ..."和给出的例子支持这种用法.

Web内容可访问性指南2.0(http://www.w3.org/TR/WCAG20-TECHS/H73.html)表示,summary属性是"简要概述数据如何组织到表中或关于如何导航表的简要说明"

WCAG 1.0(http://www.w3.org/TR/WCAG10-HTML-TECHS/#table-summary-info)说了类似的内容,并且示例再次显示了用于描述表的目的和结构的用法.


在另一方面,伊利诺伊州信息技术中心无障碍ICITA(http://html.cita.uiuc.edu/nav/dtable/dtable-rules.php)描述了属性是"最佳实践应描述内容的表格或作者打算通过表格中的数据传达的结论 "

我怀疑iCITA已经明确地选择了这个,并且有其他HTML书籍和指南建议类似的做法.

在许多方面,这种用法对我来说更有意义,因为明智地使用thead和th元素以及范围和标题属性应该足以向无视用户描述表的结构,而没有其他用户一种非视力用户获得复杂表格要点的方式,以匹配有视力的用户通过快速扫描表格获得的相同信息水平.

但是,我不愿意与WCAG经过充分研究的建议背道而驰.

所以,我的问题是:如果你在数据表的summary属性中放入任何东西,你输入目的,结构,内容描述,结论和/或其他东西,为什么?基于该属性的真实用户的反馈的原因特别受欢迎.

html accessibility

8
推荐指数
2
解决办法
4624
查看次数

使用HTML定义列表的例子,并发出bootstrap问题

我使用定义列表(dl,dd,dt)来呈现视图页面(实体的细节).描述列表对这个用例不好吗?

当与Twitter引导程序一起使用时,当 <dd></dd>为空时,所有内容都转移到顶部.这不希望显示对象的细节,该对象可能包含一些空的属性.

请看这里的小提琴http://jsfiddle.net/cPwHr/

这是一个错误吗?我怎么能阻止它.或者我应该使用普通列表(ul,li ..)或表格.

css html5 web-applications css3 twitter-bootstrap

6
推荐指数
2
解决办法
3684
查看次数

用<form>替换<span>的内容是什么?"在XHTML 1.1中,标签<form>不能包含标签<span>

我是html的初学者.我正在使用yootools的登录模块:

用什么替换<span>?我有XHTML 1.1严格doctype(更改过渡修复它),我得到错误:

"在XHTML 1.1中,标签<form>不能包含标签<span>

这是在同一行上彼此相邻排列的用户/传递盒.有什么可以替换这些跨度,所以它不会抱怨?

谢谢!

玛丽亚

编辑:现在已经清理过了.所以我只需要找到一种方法来替换<span class="username">某些东西.

<li class="login">
    <form action="/cgi-bin/login" method="post" name="Login">

        <span class="username">
        <input type="text" name="username" size="18"  value="Username"  />
        </span>

        <span class="password">
        <input type="password" name="passwd" size="10" value="Password" />
        </span>

        <span class="login-button">
        <button value="Login" name="Submit" type="submit" title="L">L</button>
        </span>

    </form>
</li>





a:focus { outline: none; }

span.username,
span.password {
    width: 74px;
    height: 16px;
    padding: 6px 5px 2px 25px;
    float: left;
    overflow: hidden;
    margin-right: 0px; 

}



span.username input,
span.password input { …
Run Code Online (Sandbox Code Playgroud)

html xhtml login

5
推荐指数
1
解决办法
5169
查看次数

是否可以将 CSS Scroll Snap 应用于 HTML 标签而不是 Body 标签

CSS Scroll Snap 允许浏览器快速滚动到容器中的元素。要将相同的逻辑应用于垂直页面滚动,我发现它必须应用于<body>而不是<html>(见下文)。这不是一个主要问题,但它确实有效地创建了一个滚动区域,<body>而不是使用窗口滚动。

虽然这看起来不错,但它有几个副作用:

  • javascript 中不能再使用窗口滚动功能
  • Apple 浏览器上的橡皮筋效果响应速度较慢,Mac 上的 Chrome 中也不存在。

我希望它看起来尽可能原生,因此唯一的结论是将它应用于<html>而不是<body>. 然而,以这种方式应用它会阻止它运行。如果您将它应用于两者,它将在 Safari 中正确呈现,但在 Chrome 和 Firefox 中仍然损坏。

问题不是因为<body>在父元素和子元素之间创建了分离,就像<div>在层次结构中添加了另一个元素一样,它仍然可以正常运行。

这是功能代码,但应用于<body>而不是<html>.

<html>
   <body>
      <div class="extra_parent">
         <div class="child">ONE</div>
         <div class="child">TWO</div>
         <div class="child">THREE etc..</div>
      </div>
   </body>
</html>

body {
    margin: 0;
    padding: 0;
    scroll-snap-type: y mandatory;
    overflow-y: scroll;
    height: 100vh;
}

html {
    height: 100vh;
    overflow: hidden
}

.child {
    position: relative;
    height: …
Run Code Online (Sandbox Code Playgroud)

css window-scroll scroll-snap-points

5
推荐指数
1
解决办法
2644
查看次数

&#x80;的规范理由 到&#x9F; 在UTF-8文档中需要浏览器行为

HTML 4.01规范说为十六进制字符引用

数字字符引用指定文档字符集中字符的代码位置.

因此,如果文档字符集编码是UTF-8,则数字引用应指定Unicode代码点.

HTML5规范说为十六进制字符引用

&符号后面必须跟一个U + 0023 NUMBER SIGN字符(#),后面必须跟一个U + 0078 LATIN SMALL LETTER X字符(x)或U + 0058 LATIN CAPITAL LETTER X字符(X),然后必须跟随一个或多个数字,范围为U + 0030 DIGIT ZERO(0)至U + 0039 DIGIT NINE(9),U + 0061 LATIN SMALL LETTER A至U + 0066 LATIN SMALL LETTER F和U + 0041 LATIN CAPITAL LETTER A到U + 0046 LATIN CAPITAL LETTER F,表示一个基数为16的整数,对应于根据下面定义允许的Unicode代码点.然后必须在数字后跟一个U + 003B SEMICOLON字符(;).

没有提到文档字符集,它只是说数字值标识Unicode代码点.

但似乎所有现代浏览器(我都没有测试过较旧的浏览器)对待€ 通过Ÿ 好像他们正在引用Windows-1252

例如,€ 显示,但U + 0080不是代码点,U + 20AC是.U + 0080的Unicode代码点定义为PAD

€ 也(正确)显示. …

html utf-8 windows-1252 character-reference

4
推荐指数
1
解决办法
1729
查看次数

HTML Doctype首先是什么?

在doctype声明之前返回空行是否有效?

<!DOCTYPE>声明必须是你的HTML文档中的第一件事情,在之前<html>的标签.

通过w3schools

html html5 doctype

3
推荐指数
1
解决办法
122
查看次数

使用Java和Regex帮助从html标记中提取文本

我想使用Regex从html文件中提取一些文本.我正在学习正则表达式,但我仍然无法理解它.我有一个代码,提取所有包含在下面的文本<body>,</body>这里是:

public class Harn2 {

public static void main(String[] args) throws IOException{

String toMatch=readFile();
//Pattern pattern=Pattern.compile(".*?<body.*?>(.*?)</body>.*?"); this one works fine
Pattern pattern=Pattern.compile(".*?<table class=\"claroTable\".*?>(.*?)</table>.*?"); //I want this one to work
Matcher matcher=pattern.matcher(toMatch);

if(matcher.matches()) {
    System.out.println(matcher.group(1));
}

}

 private static String readFile() {

      try{
            // Open the file that is the first 
            // command line parameter
            FileInputStream fstream = new FileInputStream("user.html");
            // Get the object of DataInputStream
            DataInputStream in = new DataInputStream(fstream);
            BufferedReader br = new BufferedReader(new InputStreamReader(in)); …
Run Code Online (Sandbox Code Playgroud)

html java regex tags

2
推荐指数
1
解决办法
8489
查看次数

我在javascript和html中有一个关于true或false变量的bug

我有一个程序,应该按下按钮开始改变它的背景颜色(它不是一个按钮,它是一个<h1>),但当我按下它时,背景不会改变.它应该因为变量的变化而改变,但除此之外,我认为其余的都有效.

var onf = false;

setInterval(timer(), 100);

function startUp(){
document.getElementById("Temmie").textContent = "Hi";
turnOn();
}

  function turnOn(){
  document.getElementById("Tem").style.color = 'Chartreuse';
  document.getElementById("Temmie").style.fontFamily = 'Papyrus';
  document.getElementById("Temmie").style.fontSize = '24px';
  onf = true;

  }

  function timer(){
  if(onf == true){
  t = Math.floor(Math.random() * 3) + 1;
  changeBackground();
  }
  }


 function changeBackground(){
 if(t == 1){
    document.body.style.background = 'ForestGreen';
 }

if(t == 2){
   document.body.style.background = 'DarkGreen';
}

if(t == 3){
   document.body.style.background = 'SteelBlue';
}
}
Run Code Online (Sandbox Code Playgroud)

"Tem"和"Temmie"标签连接到a

和a,但除此之外,这应该足够了.

html javascript css

1
推荐指数
1
解决办法
46
查看次数