How can I use the New York font in web content on iOS 13?

青春壹個敷衍的年華 提交于 2020-01-24 09:27:26
问题 Apple released a new font, New York, with iOS 13. Is it possible to set it in CSS for web content, like using -apple-system for San Francisco? 回答1: I was able to reference the fonts on my MacBook with these: .NewYork-Regular .NewYork-Bold .NewYork-Medium .NewYork-RegularItalic .NewYork-BoldItalic .NewYork-MediumItalic Others may exist, but these are the only ones that worked for me. I did install the font from their developer page before testing, but I'm not sure it's needed - it may be

WebKit translate + fixed background-attachment bug

旧巷老猫 提交于 2020-01-24 02:17:08
问题 http://jsfiddle.net/MR94s/ .wrap { position: absolute; z-index: 777; top: 100%; left: 0; width: 100%; min-height: 100%; background-color: white; -webkit-overflow-scrolling: touch; -moz-transform: translateX(25%); -webkit-transform: translateX(25%); -o-transform: translateX(25%); -ms-transform: translateX(25%); transform: translateX(25%); } section { position: relative; width: 100%; display: table; height: 450px; border-bottom: 2px solid #E6EAED; -webkit-box-sizing: border-box; -moz-box-sizing

HTML display of Plugin and videotag

馋奶兔 提交于 2020-01-24 01:43:24
问题 I am facing a weird problem with html display.I have a html page that has both plugin object and video tag. Both are placed under the same area. Plugin area is 970x560 and video area is 320x240px. The plugin renders images which have a rectangular hole cut inside them to view the video(i.e., some part of images rendered have transparent pixels (alpha opaque=0 ) just to display the video). Now on launching of this html application in chrome, I am able to see only the video first frame and not

Why does this repaint/reflow hack work?

流过昼夜 提交于 2020-01-23 03:02:04
问题 Sometimes we have to force repaint/reflow for the browser to render certain states. For instance: window.onload = function () { setTimeout(function(){ document.getElementById("gradient_text").innerHTML = "bar"; }, 500); } #gradient_div { background: linear-gradient(#000000,#ffffff); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } <div id="gradient_div"> <p id="gradient_text" onload="update"> Foo </p> </div> The "gradient_text" element, refuses to visually update its

Pyside, webkit basic question

自古美人都是妖i 提交于 2020-01-22 09:44:46
问题 I am currently running this code, and although the web browser appears, the web inspector doesn't seem to display anything, am i doing something incorrectly? import sys from PySide.QtCore import * from PySide.QtGui import * from PySide.QtWebKit import * app = QApplication(sys.argv) web = QWebView() web.load(QUrl("http://www.google.com")) web.show() inspect = QWebInspector() inspect.setPage(web.page()) inspect.show() sys.exit(app.exec_()) 回答1: It is in the Qt Documentation: Note: A

contentEditable on nodes in a XML/compound document?

杀马特。学长 韩版系。学妹 提交于 2020-01-22 02:24:46
问题 I have an XML document that I'm displaying in a web browser, with a stylesheet attached: <?xml version="1.0" encoding="UTF-8" standalone="yes"?> <?xml-stylesheet type="text/css" href="abc.css"?> <myxml xmlns:xhtml="http://www.w3.org/1999/xhtml"> <para>I wish i was editable</para> <xhtml:script type="text/javascript" src="abc.js"/> </myxml> With the xhtml namespace declaration, and xhtml:script tag, I can execute javascript. What I'd like to do is to make arbitrary non-XHTML elements in this

SVG with embedded bitmap not showing bitmap when using <img> tag in webkit browser

狂风中的少年 提交于 2020-01-21 08:30:06
问题 I am trying to use a SVG with an embedded bitmap as a navigation element. The idea is to make it more mobile friendly. I already have a PNG fallback in place for IE8 and below. Somehow the embedded bitmap doesn't show in webkit based browsers. SVG without bitmap embedded show just fine. I can get the background to show in webkit using the "object" tag but then my links don't work, I can't control the width and I run into a documented bug of safari where image is not scaled and sliders appear.

WebKit Hyphenation

大城市里の小女人 提交于 2020-01-21 04:07:27
问题 Has anyone successfully been able to implement hyphenation in any of the WebKit browsers? I've tried the CSS3 hyphenation style as well as -webkit-hyphens: auto . No dice for either of those. Or maybe I'm doing something wrong? Note: I've only tried Safari and Chrome on a Mac. Update: Code example <html> <head> <style> div { -webkit-hyphens: auto; } </style> </head> <body> <div style="width: 150px; border: solid 1px black;"> <p>Anaideia, spirit of ruthlessness, shamelessness, and

Ignoring Webkit-specific CSS selector in Firefox

ε祈祈猫儿з 提交于 2020-01-19 05:40:30
问题 I'm working on a jQuery theme which includes styling for as many form elements as possible. Initially it was developed for Webkit (Chrome). Now I want to make it work with Firefox as well. Problem is; Firefox has problems with some Webkit-specific syntax. For example: input[type="range"]::-webkit-slider-thumb, input[type=radio], input[type=checkbox] { -webkit-appearance: none !important; -moz-appearance: none; width: 1.2em; height: 1.2em; border: 1px solid black; background: #666666 url

How to clip canvas with CSS clip-path?

一世执手 提交于 2020-01-15 09:10:44
问题 I know that I can clip a canvas by creating a path with getContext('2d') and setting globalCompositeOperation . I've noticed that sometimes I'm able to clip a canvas with -webkit-clip-path , or clip-path on other browsers (I'm on Chrome), and sometimes I'm not able to: Using this HTML: <canvas width="300" height="60"></canvas> and CSS: canvas { -webkit-clip-path: polygon(50% 33%, 75% 10%, 80% 80%, 60% 75%, 40% 60%, 20% 10%, 40% 20%, 50% 33%); } produces this: Which appears to be correct.